
/* contents common title
------------------------------------------------------------*/
a:hover {
	opacity: 0.7;
	text-decoration: none;
}

div.work_holdings_intro_area {
	padding: 6rem 0;
}

h2.work_holdings_intro_h2 {
	font-family: "Noto Sans Japanese", sans-serif;
	font-size: 2.7rem;
	/* font-weight: bold; */
	text-align: center;
	letter-spacing: 0.8rem;
	color: #333;
	line-height: 190%;
}

.holdings_wrap{
	margin: 0 0 18%;
}
section.work_holdings_section {
    margin: 0 0 8rem;
}

div.holdings_1_left {
	position: relative;
	width: 50%;
	text-align: right;
}
div.holdings_1_left > img {
	width: 96%;
}


div.holdings_1_right {
	position: relative;
	width: 50%;
}

div#holdings_str {
	position: absolute;
	top: 50%;
	left: 10%;
	transform: translateY(-50%);
	line-height: 220%;
 font-weight: bold;
}

div#holdings_str_sp {
	display: none;
}




div.holdings_2_left {
	width: 96px;
}
div.holdings_2_right {
	width: calc(100% - 96px);
}


h5.holdings_2_year,
h5.holdings_2_title {
	position: relative;
	margin: 0;
	padding: 0.5em;
	font-size: 1.6rem;
	font-weight: bold;
}

h5.holdings_2_year {
	width: 100%;
}
h5.holdings_2_year:after {
	content: "";
	position: absolute;
	top: 50%;
	right: 1.5rem;
	transform: translateY(-50%);
	width: 16px;
	height: 16px;
	background: #006a8f;
	background: -moz-linear-gradient(left, rgba(0, 104, 143, 1) 0%, rgba(0, 135, 143, 1) 100%);
	background: -webkit-linear-gradient(left, rgba(0, 104, 143, 1) 0%, rgba(0, 135, 143, 1) 100%);
	background: linear-gradient(to right, rgba(0, 104, 143, 1) 0%, rgba(0, 135, 143, 1) 100%);
}

h5.holdings_2_title {
	width: 100%;
	margin-bottom: 1rem;
	background: #006a8f;
	background: -moz-linear-gradient(left, #006a8f 0%, #00878f 100%);
	background: -webkit-linear-gradient(left, #006a8f 0%,#00878f 100%);
	background: linear-gradient(to right, #006a8f 0%,#00878f 100%);
	color: #FFF;
	text-align: center;
}

h5.holdings_2_title:before {
	content: "";
	position: absolute;
	top: 16px;
	left: -4px;
	transform: translateY(-50%) rotateZ(45deg);
	width: 16px;
	height: 16px;
	background: #006a8f;
}

div.holdings_2_inner {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 1rem;
}


div.holdings_2_img {
	width: 30%;
}
div.holdings_2_img > img {
	width: 100%;
}
div.holdings_2_str {
	width: 70%;
	padding: 1rem;
	background-color: #EEE;
}

h3.holdings_2_title {
}
h3.holdings_2_title > span {
	font-size: 1.6rem;
}


p.holdings_2_p {
}

div.holdings_2_link_area {
	text-align: right;
}

a.holdings_2_link {
	display: inline-block;
	width: 12em;
	padding: 0.5em;
	text-align: center;
	text-decoration: none;
	background-color: #FFF;
	color: #555;
}





div.work_index_box_str {
	width: 50%;
	padding: 4rem 4rem 2rem 4rem;
	background-color: #DDD;
}

div.work_index_box_img {
	width: 50%;
}

.work_story {
	width: 100%;
	height: 100%;
	background-image: url(../img/work/index/story.png);
	background-position: center center;
	background-size: cover;
}
.work_holdings {
	width: 100%;
	height: 100%;
	background-image: url(../img/work/index/holdings.png);
	background-position: center center;
	background-size: cover;
}


h5.work_index_box_title_en {
	position: relative;
	margin: 0;
	font-size: 2rem;
	letter-spacing: 0.2rem;
	color: #006a8f;
	color: -moz-linear-gradient(left, #006a8f 0%, #00878f 100%);
	color: -webkit-linear-gradient(left, #006a8f 0%,#00878f 100%);
	color: linear-gradient(to right, #006a8f 0%,#00878f 100%);
}
h1.work_index_box_title_ja {
	position: relative;
	margin: 0;
	font-size: 3rem;
	letter-spacing: 0.2rem;
	color: #006a8f;
	color: -moz-linear-gradient(left, #006a8f 0%, #00878f 100%);
	color: -webkit-linear-gradient(left, #006a8f 0%,#00878f 100%);
	color: linear-gradient(to right, #006a8f 0%,#00878f 100%);
}
hr.work_index_box_hr {
	margin: 2rem 0;
	width: 6rem;
	height: 2px;
	border: none;
	background-color: #006a8f;
	background-color: -moz-linear-gradient(left, #006a8f 0%, #00878f 100%);
	background-color: -webkit-linear-gradient(left, #006a8f 0%,#00878f 100%);
	background-color: linear-gradient(to right, #006a8f 0%,#00878f 100%);
}


@media screen and (max-width: 960px) {

	div.holdings_1_left {
		width: 100%;
	}

	div.holdings_1_right {
		width: 100%;
	}

	div#holdings_str {
		display: none;
	}

	div#holdings_str_sp {
		width: 90%;
		margin: 3% auto 5%;
		display: block;
		font-weight: 500;
		line-height: 180%;
		text-align: justify;
	}


	div.holdings_2_left {
		width: 80px;
		background: url(../img/work/holdings/border.png) repeat-y;
		background-position: 72% top;
	}
	div.holdings_2_right {
		width: calc(100% - 80px);
	}

	h5.holdings_2_year {
		padding: 0;
		font-size: 1.4rem;
	}

	h5.holdings_2_title:before {
		top: 12px;
	}


	div.holdings_2_img {
		width: 100%;
	}

	div.holdings_2_str {
		width: 100%;
	}

	h3.holdings_2_title > span {
		display: block;
	}




	div.work_index_box_str {
		width: 100%;
		padding: 2rem 2rem 1rem 2rem;
	}

	div.work_index_box_img {
		width: 100%;
	}
	div.work_box_img_div {
		width: 100%;
		padding-top: 60%;
	}
	p.work_index_box_p {
		font-size: 1.6rem;
	}

}






/*---pc style--------------------------------------------- */

@media screen and (min-width: 650px) {

.pc_non{display: none;}

.flex{display: flex;}
.box_left, .box_right{display: align-items;}

.container{width: 1000px;margin: 0 auto;}

h2{
	text-align: center;
	font-size: 2rem;
	font-weight: bold;
	line-height: 2;
	letter-spacing: 0.2em;
	margin-bottom: 8%;
}

/* holdings_1 */

.holdings_1 {
	margin-bottom: 12%;
}
.holdings_1 .box_left{
	width: 51%;
	margin: 0 1.5% 0 2%;
}
.holdings_1 .text{
	margin-top: 13%;
}
.holdings_1 .text p{
	font-size: 0.9rem;
	line-height: 3;
	color: #1a1a1a;
}


/* history */

.history{
	position: relative;
	background: url("../img/work/holdings/box_bg.png") repeat-y 9%;
	padding-bottom: 7%;
	max-width: 1000px;
	margin: 0 auto;
}
.history:after {
  content: "";
  position: absolute;
  top: 2%;
  left: 8.2%;
  width: 20px;
  height: 20px;
  background: #006a8f;
  background: -moz-linear-gradient(left, #0068A2 0%, #009CA2 100%);
  background: -webkit-linear-gradient(left, #0068A2 0%, #009CA2 100%);
  background: linear-gradient(to right, #0068A2 0%, #009CA2 100%);
}
.history .history_box{
	position: relative;
	margin-bottom: 1%;
	margin-left: auto;
	width: 88%;
}
.holdings_2.history{
	position: relative;
	background-image:url("../img/work/holdings/w_bg.png"),url("../img/work/holdings/box_bg.png");
	background-repeat: no-repeat,repeat-y;
	background-position: 9% top,9% top;
	padding-bottom: 7%;
	max-width: 1000px;
	margin: 0 auto;
}
.holdings_5.history{
	position: relative;
	background-image:url("../img/work/holdings/g_bg.png"),url("../img/work/holdings/box_bg.png");
	background-repeat: no-repeat,repeat-y;
	background-position: 8.5% bottom,9% bottom;
	padding-bottom: 2%;
	max-width: 1000px;
	margin: 0 auto;
}
/* box_title */

.history h5{
	width: 88%;
	background: #006a8f;
	background: -moz-linear-gradient(left, #006a8f 0%, #00878f 100%);
	background: -webkit-linear-gradient(left, #006a8f 0%,#00878f 100%);
	background: linear-gradient(to right, #006a8f 0%,#00878f 100%);
	color: #FFF;
	text-align: center;
	position: relative;
	margin: 0 0 15px auto;
	padding: 1.5% 0;
	font-size: 1.4rem;
	letter-spacing: 0.2em
}
.history h5::before {
  content: "";
  position: absolute;
  top: 17px;
  left: -9px;
	border-top: 5px solid transparent;
	border-right: 10px solid #006a8f;
	border-bottom: 5px solid transparent;
}


/* photo box */
.history .box_left{
	width: 30%;
}
.history .box_right{
	background: #F2F2F2;
	width: 70%;
}
.history .mask{
	/* width: 250px; */
	max-height: 250px;
	overflow: hidden;
}


/* text box */

.history .text{
	padding: 5% 5% 0 5%;
}
.history .text h3{
	font-size: 2.2rem;
	font-weight: bold;
	letter-spacing: 0.2em;
}
.history .text h3 span{
	font-size: 1.6rem;
	letter-spacing: 0em;
	padding-left: 1%;
}
.history .text p{
	font-size: 1.3rem;
	line-height: 2;
	margin: 0.8em 0;
}


/* button */

.history a.button {
    position: absolute;
    top: 75%;
    right: 3%;
    display: inline-block;
    width: 18em;
    padding: 1em 1.2em;
    text-align: center;
    background: url(../img/work/holdings/arrow.png) no-repeat 95% 50%;
    background-color: #FFF;
    color: #4D4D4D;
    font-size: 1.2rem;
    font-weight: bold;
    letter-spacing: 0.1em;
}
.history a.button > span.glyphicon {
    display: block;
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
}
/* holdings_2 */

.holdings_2::before{
	content: "1979年";
  position: absolute;
  top: 2%;
  left: 0px;
	color: #acacac;
	font-size: 1.8rem;
	font-weight: 500;
	letter-spacing: 0.1em;
}
.holdings_2 img {
    border: none;
    position: relative;
		top: -10%;
    left: -44%;
}

/* holdings_3 */

.holdings_3::before{
	content: "2008年";
  position: absolute;
  top: 2%;
  left: 0px;
	color: #acacac;
	font-size: 1.8rem;
	font-weight: 500;
	letter-spacing: 0.1em;
}
.holdings_3 img {
    border: none;
    position: relative;
		top: -10%;
    left: -44%;
}

/* holdings_4 */

.holdings_4::before{
	content: "2014年";
  position: absolute;
  top: 1.5%;
  left: 0px;
	color: #acacac;
	font-size: 1.8rem;
	font-weight: 500;
	letter-spacing: 0.1em;
}
.holdings_4 .img01 img{
    border: none;
    position: relative;
		top: -5%;
    left: 0;
}
.holdings_4 .img02 img {
    border: none;
    position: relative;
		top: -10%;
    left: -40%;
}
.holdings_4:after {
  position: absolute;
  top: 2%;
}

/* holdings_5 */

.holdings_5::before{
	content: "2015年";
  position: absolute;
  top: 3%;
  left: 0px;
	color: #acacac;
	font-size: 1.8rem;
	font-weight: 500;
	letter-spacing: 0.1em;
}
.holdings_5 h5::before{
	position: absolute;
  top: 45%;
  left: -9px;
}
.holdings_5 .img01 img{
    border: none;
    position: relative;
		top: -2%;
    left: -30%;
}
.holdings_5 .img02 img {
    border: none;
    position: relative;
		top: -10%;
    left: -20%;
}
.holdings_5:after {
  position: absolute;
  top: 3.5%;
}
}





/*---sp style--------------------------------------------- */

@media screen and (max-width: 649px) {

img{max-width: 100%;height: auto;}
body{-webkit-text-size-adjust: 100%}
#wrap{overflow: hidden;}

.sp_none{display: none;}

.container{
	width: 95%;
	margin: 0 auto;
}
h2{
	text-align: center;
	font-size: 1.6rem;
	font-weight: bold;
	line-height: 2;
	letter-spacing: 0.2em;
	margin-bottom: 10%;
}

/* holdings_1 */

.holdings_1 {
	margin-bottom: 12%;
}
.holdings_1 .box_left{
	width: 85%;
	margin: 0 auto;
}
.holdings_1 .text p{
	font-size: 0.6rem;
	line-height: 2.6;
}


.holdings_5.history{
	background-image:url("../img/work/holdings/g_bg.png"),url("../img/work/holdings/box_bg.png");
	background-repeat: no-repeat,repeat-y;
	background-position: 50% bottom,50% bottom;
}

.history .history_box{
	margin: auto;
	width: 90%;
	margin-bottom: 4%;
}
.history:after {
	content: "";
  position: absolute;
  top: -3%;
  left: 5%;
  transform: translateY(-50%);
  width: 4vw;
  height: 4vw;
  background: #006a8f;
  background: -moz-linear-gradient(left, #0068A2 0%, #009CA2 100%);
  background: -webkit-linear-gradient(left, #0068A2 0%, #009CA2 100%);
  background: linear-gradient(to right, #0068A2 0%, #009CA2 100%);
}

.history{
	position: relative;
	background: url("../img/work/holdings/box_bg.png") repeat-y 50%;
	padding-bottom: 18%;
}


/* holdings_2 */

.holdings_2::before{
	font-family: 'Noto Sans Japanese', sans-serif;
	content: "1979年";
	position: absolute;
	top: 0.2%;
	left: 0px;
	color: #808080;
	font-size: 0.1rem;
	letter-spacing: 0.1em;
}


/* box title */

.history h5{
	width: 90%;
	background: #006a8f;
	background: -moz-linear-gradient(left, #006a8f 0%, #00878f 100%);
	background: -webkit-linear-gradient(left, #006a8f 0%,#00878f 100%);
	background: linear-gradient(to right, #006a8f 0%,#00878f 100%);
	color: #FFF;
	text-align: center;
	position: relative;
	margin: 0 auto 3%;
	padding: 2% ;
	font-size: 1.6rem;
	line-height: 1.7;
	letter-spacing: 0.1em
}
.history h5::before {
  display:none;
}


/* photo box */

.history .mask{
	width: 100%;
	height: auto;
}


/* text box */

.history .box_right{
	background: #F2F2F2;
	padding: 5% 6% 7%;
}
.history .text{
	margin-bottom: 6%;
}
.history .text h3{
	font-size: 3rem;
	font-weight: bold;
	letter-spacing: 0.2em;
	line-height: 1.2;
	margin-bottom: 4%;
}
.history .text h3 span{
	font-size: 1.8rem;
	letter-spacing: 0em;
}
.history .text p{
	font-size: 1.8rem;
	line-height: 2;
}


/* button */

.history a.button {
	  position:relative;
    display: block;
    width: 100%;
    padding: 1em 1.2em;
    text-align: center;
    background: url(../img/work/holdings/arrow.png) no-repeat 95% 50%;
    background-size: 4%;
    background-color: #FFF;
    color: #4D4D4D;
    font-size: 1.6rem;
    font-weight: bold;
    letter-spacing: 0.1em;
    margin: 0 auto;
}
.history a.button > span.glyphicon {
    display: block;
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
}
/* holdings_2 */

.holdings_2::before{
	font-family: 'Noto Sans Japanese', sans-serif;
	content: "1979年";
	position: absolute;
	top: -5%;
	left: 10%;
	 color: #808080;
	font-size: 2rem;
	font-weight: 600;
	letter-spacing: 0.1em;

}
.holdings_2 img {
    border: none;
    position: relative;
		top: -20%;
}

/* holdings_3 */

.holdings_3::before{
	font-family: 'Noto Sans Japanese', sans-serif;
	content: "2008年";
	position: absolute;
	top: -5%;
	left: 10%;
	color: #808080;
	font-size: 2rem;
	font-weight: 600;
	letter-spacing: 0.1em;
}
.holdings_3 img {
    border: none;
    position: relative;
		top: -20%;
}

/* holdings_4 */

.holdings_4::before{
	font-family: 'Noto Sans Japanese', sans-serif;
	content: "2014年";
	position: absolute;
	top: -3%;
	left: 10%;
	color: #808080;
	font-size: 2rem;
	font-weight: 600;
	letter-spacing: 0.1em;
}

.holdings_4 img {
    border: none;
    position: relative;
		top: -20%;
}
.history.holdings_4:after {
    top: -2%;
    left: 5%;
}
/* holdings_5 */

.holdings_5::before{
	font-family: 'Noto Sans Japanese', sans-serif;
	content: "2015年";
	position: absolute;
	top: -3%;
	left: 10%;
	color: #808080;
	font-size: 2rem;
	font-weight: 600;
	letter-spacing: 0.1em;
}
.history.holdings_5:after {
    top: -2%;
    left: 5%;
}
.holdings_5 img {
    border: none;
    position: relative;
		top: -20%;
}
}
