@charset "UTF-8";

@media screen and (min-width:768px){
/*pc・タブレットcss*/

#muku{
display:block;height:0px;overflow:hidden;text-indent:-9999px;margin-top:-24px;padding-bottom:24px;
}

#nurikabe{
display:block;height:0px;overflow:hidden;text-indent:-9999px;margin-top:-24px;padding-bottom:24px;
}

#toryou{
display:block;height:0px;overflow:hidden;text-indent:-9999px;margin-top:-24px;padding-bottom:24px;
}


.h2-ttl { height: 180px; font-size: 24px; font-weight: bold; line-height: 1.5; letter-spacing: 0.05em; color: #191919; background: url(../images/performance/h2.jpg) no-repeat top; }

.main-contents { color: #191919; font-size: 14px; line-height: 2.2; }
.main-contents .page-sub-ttl { background: #fff; line-height: normal; color: #38520a; text-align: center; font-size: 55px; font-weight: 600; letter-spacing: .1em; font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3","Sawarabi Mincho","Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; padding: 0 10px; margin: 0 auto 40px; position: relative; bottom: 10px; }
.main-contents .page-sub-ttl .inner-txt { color: #191919; font-size: 16px; display: block; letter-spacing: .08em; }
.main-contents .border { background: url(../images/common/common-border.jpg) repeat-x center; }
.main-contents .txt-box { letter-spacing: .05em; line-height: 2.4; }
.main-contents .sub-ttl02 { color: #191919; font-size: 24px; line-height: 2; letter-spacing: .15em;
font-weight: bold;
}

#contents01 { margin-bottom: 80px; }
#contents01 .bg { background: url(../images/material/ttl2-bg.jpg) no-repeat top; padding: 128px 0 19px; }
#contents01 .sub-ttl { color: #ffffff; font-size: 28px; font-weight: 600; letter-spacing: .3em; }
#contents01 .en { font-size: 18px; color: #ffffff; position: relative; left: 50px; letter-spacing: .1em; }
#contents01 .en::before { content: ''; display: inline-block; height: 1px; width: 44px; position: absolute; left: -50px; top: 16px; background: #fff; }

#contents02 { margin-bottom: 80px; }
#contents02 .bg { background: url(../images/material/ttl3-bg.jpg) no-repeat top; padding: 40px 0 18px; }
#contents02 .bg .inner-sub-ttl { color: #3c502b; font-size: 59px; font-weight: 600; position: relative; left: 50px; }
#contents02 .bg .en-txt { position: relative; left: 33%; }
#contents02 .bg .inner-txt { color: #ffffff; font-size: 17px; font-weight: 600; background-color: #3c502b; padding: 8px 0; text-align: center; letter-spacing: .1em; }
#contents02 .txt-box { width: 409px; }
#contents02 .material-box{position: relative;}
#contents02 .material-icon{position: absolute;top:50px;right:100px;}



#contents03 { margin-bottom: 80px; }
#contents03 .box { padding: 10px 0; text-align: center; background: url(../images/common/straipe-green.png); color: #ffffff; font-size: 26px; font-weight: 600; letter-spacing: .1em; margin-bottom: 64px; }
#contents03 .txt-box { width: 391px; }


#contents03 .page-sub-ttl { width: 418px; font-size: 42px; }


#contents03 .txt { color: #191919; font-size: 28px; font-weight: 700; padding: 10px 0; text-align: center; background: url(../images/performance/stripe.png); }

#contents03 .anchor-link{overflow: hidden;margin-bottom: 64px;}
#contents03 .anchor-link a{color: #fff;font-weight: bold;font-size: 16px;}
#contents03 .anchor-link a li{float: left;width: 250px;margin-right: 20px;padding-top: 3px;
padding-bottom: 16px;

}


#contents03 .anchor-link a li img{
  	transition: 0.3s;
}

#contents03 .anchor-link a li img:hover{
		-webkit-transform: translate(0px,4px);
		-moz-transform: translate(0px,4px);
		-ms-transform: translate(0px,4px);
		-o-transform: translate(0px,4px);
		transform: translate(0px,4px);
}

#contents03 .anchor-link a:nth-child(3) li{margin-right: 0px;}

#contents04 { margin-bottom: 80px; }
#contents04 .txt-box { width: 387px; order: 1; }
#contents04 .page-sub-ttl { width: 332px; font-size: 40px; }

#contents05 { border-bottom: 1px solid #bfbfbf; padding-bottom: 50px; }
#contents05 p.txt2 { color: #191919; font-size: 18px; font-weight: 700; padding: 10px 0; text-align: center; }

#contents06 { padding: 40px 0; line-height: 2.2; }
#contents06 .bg { background: url(../images/material/bg.jpg) no-repeat top; padding: 78px 0 39px; margin-bottom: 50px; }
#contents06 .bg .top-txt { color: #01481c; font-size: 18px; font-weight: 600; line-height: 1.8; position: relative; left: 20px; margin-bottom: 338px; letter-spacing: .1em; }
#contents06 .bg .bttom-txt { color: #ffffff; font-size: 14px; font-weight: 600; line-height: 1.8; position: relative; left: 20%; letter-spacing: .1em; }
#contents06 .bg .bttom-txt::after { content: url(../images/material/en-txt02.png); position: absolute; right: 32%; bottom: -62px; }


#contents02 .box-txt:after,
#contents03 .box-txt:after,
#contents04 .box-txt:after { content: url(../images/design/arrow.png); display: block; text-align: center; margin: 0.5em;}
#contents02 .box,
#contents03 .box,
#contents04 .box { width: 400px; margin: 0 auto 50px;}
#contents02 .box a,
#contents03 .box a,
#contents04 .box a { text-decoration: none;display: block; padding: 10px; text-align: center; background: url(../images/common/straipe-green.png); color: #ffffff; font-size: 16px; font-weight: 600; letter-spacing: .1em; }

}


@media screen and (max-width:767px){
/*スマホ用css*/

#muku{
display:block;height:0px;overflow:hidden;text-indent:-9999px;margin-top:-24px;padding-bottom:24px;
}

#nurikabe{
display:block;height:0px;overflow:hidden;text-indent:-9999px;margin-top:-24px;padding-bottom:24px;
}

#toryou{
display:block;height:0px;overflow:hidden;text-indent:-9999px;margin-top:-24px;padding-bottom:24px;
}


.h2-ttl { height: 180px; font-size: 24px; font-weight: bold; line-height: 1.5; letter-spacing: 0.05em; color: #191919; background: url(../images/performance/h2.jpg) no-repeat top; }

.main-contents { color: #191919; font-size: 14px; line-height: 2.2; }
.main-contents .page-sub-ttl { line-height: normal; color: #38520a; text-align: center; font-size: 28px; font-weight: 600; letter-spacing: .1em; font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3","Sawarabi Mincho","Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; padding: 0; margin: 0 auto 30px; position: relative; bottom: 5px; }
.main-contents .page-sub-ttl .inner-txt { color: #191919; font-size: 16px; display: block; letter-spacing: .08em; }
.main-contents .page-sub-ttl strong { background: #ffffff; padding: 0 10px;}
.main-contents .border { background: url(../images/common/common-border.jpg) repeat-x center; }
.main-contents .txt-box { letter-spacing: .05em; line-height: 2.4; }
.main-contents .sub-ttl02 { color: #191919; font-size: 24px; line-height: 2; letter-spacing: .15em;
font-weight: bold;
}

#contents01 { margin-bottom: 80px; }
#contents01 h4 img { width: 100%; height: auto; }
#contents01 .bg { background: url(../images/material/ttl2-bg.jpg) no-repeat top; padding: 80px 0 20px; margin-bottom: 30px; }
#contents01 .bg + .ac { text-align: left; }
#contents01 .sub-ttl { color: #ffffff; font-size: 28px; font-weight: 600; letter-spacing: .3em; }
#contents01 .en { font-size: 18px; color: #ffffff; position: relative; left: 50px; letter-spacing: .1em; }
#contents01 .en::before { content: ''; display: inline-block; height: 1px; width: 44px; position: absolute; left: -50px; top: 16px; background: #fff; }

#contents02 { margin-bottom: 80px; }
#contents02 .bg { background: url(../images/material/ttl3-bg.jpg) no-repeat top; padding: 40px 0 18px; }
#contents02 .bg .inner-sub-ttl { color: #3c502b; font-size: 59px; font-weight: 600; position: relative; left: 50px; }
#contents02 .bg .en-txt { position: relative; left: 33%; }
#contents02 .bg .inner-txt { color: #ffffff; font-size: 17px; font-weight: 600; background-color: #3c502b; padding: 8px 0; text-align: center; letter-spacing: .1em; }
#contents02 .txt-box { width: 409px; }
#contents02 .material-box{position: relative;}
#contents02 .material-icon{position: absolute;top:50px;right:100px;}



#contents03 { margin-bottom: 80px; }
#contents03 .ten-ce { display: block; }
#contents03 .box { padding: 10px 0; text-align: center; background: url(../images/common/straipe-green.png); color: #ffffff; font-size: 26px; font-weight: 600; letter-spacing: .1em; margin-bottom: 64px; }
#contents03 .txt-box { margin-bottom: 20px; }
#contents03 .txt-box + div { text-align: center; }
#contents03 .txt-box + div img { width: 100%; max-width: 365px; height: auto; }


#contents03 .txt { color: #191919; font-size: 28px; font-weight: 700; padding: 10px 0; text-align: center; background: url(../images/performance/stripe.png); }

#contents03 .anchor-link{overflow: hidden;margin-bottom: 64px;}
#contents03 .anchor-link a{color: #fff;font-weight: bold;font-size: 16px;}
#contents03 .anchor-link a li{float: left;width: 250px;margin-right: 20px;padding-top: 3px;
padding-bottom: 16px;

}


#contents03 .anchor-link a li img{
  	transition: 0.3s;
}

#contents03 .anchor-link a li img:hover{
		-webkit-transform: translate(0px,4px);
		-moz-transform: translate(0px,4px);
		-ms-transform: translate(0px,4px);
		-o-transform: translate(0px,4px);
		transform: translate(0px,4px);
}

#contents03 .anchor-link a:nth-child(3) li{margin-right: 0px;}

#contents04 { margin-bottom: 80px; }
#contents04 .ten-ce { -webkit-flex-wrap: wrap; flex-wrap: wrap; }
#contents04 .txt-box { -webkit-flex-basis: 100%; flex-basis: 100%; -webkit-order: 1; order: 1; }
#contents04 .txt-box + div { -webkit-flex-basis: 100%; flex-basis: 100%; -webkit-order: 2; order: 2; }
#contents04 .txt-box + div img { width: 100%; max-width: 365px; height: auto; }

#contents05 { border-bottom: 1px solid #bfbfbf; padding-bottom: 40px; }
#contents05 p.txt2 { color: #191919; font-size: 18px; font-weight: 700; padding: 10px 0 0; margin-bottom: 0; }

#contents06 { padding: 0; line-height: 2.2; }
#contents06 .bg { background: url(../images/material/bg_sp.jpg) no-repeat bottom / 100% auto; padding: 20px 20px 40vh; }
#contents06 .bg .top-txt { color: #01481c; font-size: 18px; font-weight: 600; line-height: 1.8; letter-spacing: .1em; }
#contents06 .bttom-txt { color: #ffffff; font-size: 14px; font-weight: 600; line-height: 1.8; position: relative; letter-spacing: .1em; margin-bottom: 50px; background: #3D4E2C ; padding: 40px 20px 20px;}
#contents06 .bttom-txt::before { content: url(../images/material/en-txt02.png); position: absolute; right: 0; left: 0; top: -20px; width: 233px; margin: auto; }


#contents02 .box-txt:after,
#contents03 .box-txt:after,
#contents04 .box-txt:after { content: url(../images/design/arrow.png); display: block; text-align: center; margin: 0.5em;}
#contents02 .box,
#contents03 .box,
#contents04 .box { width: 100%; margin: 0 auto 50px;}
#contents02 .box a,
#contents03 .box a,
#contents04 .box a { text-decoration: none;display: block; padding: 10px; text-align: center; background: url(../images/common/straipe-green.png); color: #ffffff; font-size: 16px; font-weight: 600; letter-spacing: .1em; }

}