@charset "utf-8";
/* CSS Document */
p{font-size: 12px;}
.contentsBoxInner{max-width: 90%; width: 100%; margin: auto; padding: 50px 0;}
h3.ttl-h3{font-size: 25px; width: 120px;}
.ttl-h4{font-size: 25px;}

/*main*/
#mainView{background: url(../images/fv_bg_sp.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; position: relative;}
#mainView .logo{width: 200px;}
#mainView .ttl{width: 90%; max-width: 90%; height: auto; margin: 0 auto; padding: 30% 0 60%;}

/*dna*/
#dna .dnaBox{max-width: 100%;}
#dna .dnaBox .flexBox{display: block;}
#dna .dnaBox .flexBox .img{width: 70%; margin: 0 auto;}
#dna .dnaBox .flexBox .txtBox{width: 100%;}
#dna .dnaBox .flexBox .txtBox .Ttl{margin: 2em auto 1em;}
#dna .dnaBox .flexBox .txtBox .moreLink a{width: 100%; font-size: 15px; padding: 7px 25px;}
#dna .dnaBox .btnBox{margin: 2em 0 0;}

/*recruit*/
#recruit{background: none;}
#recruit .recruitBox{padding: 40px 20px;}
#recruit .recruitBox::before{content: none;}
#recruit .recruitBox::after{content: none;}
#recruit .recruitBox .ttl-h3{width: 70%; font-size: 25px;}
#recruit .recruitBox .imgBox{margin: 1em auto;}
#recruit .recruitBox .whiteBox{width: 100%; max-width: 100%; margin-top: 2em; padding: 2em 0 3.5em;}
#recruit .recruitBox .naibulink a{font-size: 15px; width: 90%; padding: 5px 25px 5px;}
#recruit .recruitBox .naibulink a::before{width: 15px; height: 15px; bottom: -25px;}
#recruit .btnBox{margin: 2em 0 0;}

/*内部リンク*/
#dnaSec .LinkBox{width: 90%; margin: 0 auto; padding: 3em 0;}
#dnaSec .LinkBoxttl{max-width: 100%; font-size: 25px;}
#dnaSec .LinkBoxflex{margin: 0;}
#dnaSec .LinkBoxflex p{margin-bottom: 2em; width: calc(95% / 4);}
#dnaSec .LinkBox a{font-size: 20px; padding: 0 0.5em 1em; color: #dd470c; border-right: 1px dashed #dd470c;}
#dnaSec .LinkBox a::before{width: 15px; height: 15px; border-top: 3px solid #dd470c; border-right: 3px solid #dd470c;}

/*point_one*/
#point_one{background: none;}
#point_one .contentsBoxInner{max-width: 90%;}
#point_one .orangekakko{width: 100%; max-width: 100%; background: linear-gradient(#dd470c, #dd470c) left top / 20px 3px no-repeat, linear-gradient(#dd470c, #dd470c) left center / 3px 100% no-repeat, linear-gradient(#dd470c, #dd470c) left bottom / 20px 3px no-repeat, linear-gradient(#dd470c, #dd470c) right top / 20px 3px no-repeat, linear-gradient(#dd470c, #dd470c) right center / 3px 100% no-repeat, linear-gradient(#dd470c, #dd470c) right bottom / 20px 3px no-repeat;}
#point_one .ttl-h4 .en{font-size: 22px;}
#point_one .ttl-h4 .small{font-size: 22px;}
#point_one .ttl{font-size: 25px;}
#point_one .ttl .small{font-size: 22px;}
#point_one .whiteBox .orangettl{width: 80%; top: -5%;}
#point_one .whiteBox .flexBox{display: block;}
#point_one .whiteBox{padding: 3em 2em 1em; border: solid #f1ddd6 3px; border-radius: 15px;}
#point_one .whiteBox .innerttl{padding: 5px 40px 5px 25px; display: block;}

/*point_two*/
#point_two .contentsBoxInner{max-width: 90%;}
#point_two .bluekakko{width: 100%; max-width: 100%; background: linear-gradient(#009696, #009696) left top / 20px 3px no-repeat, linear-gradient(#009696, #009696) left center / 3px 100% no-repeat, linear-gradient(#009696, #009696) left bottom / 20px 3px no-repeat, linear-gradient(#009696, #009696) right top / 20px 3px no-repeat, linear-gradient(#009696, #009696) right center / 3px 100% no-repeat, linear-gradient(#009696, #009696) right bottom / 20px 3px no-repeat}
#point_two .whiteBox{padding: 2em 2em 0.5em; border: solid #c5dce8 3px; border-radius: 15px;}
#point_two .whiteBox .bluettl{width: 80%; top: -5%;}
#point_two .whiteBox .flexBox{display: block;}
#point_two .whiteBox .flexBox .leftBox{padding: 7px 50px 7px 30px; display: inline-block;}

/*point_three*/
#point_three .contentsBoxInner{max-width: 90%;}
#point_three .orangekakko{width: 100%; max-width: 100%; background: linear-gradient(#dd470c, #dd470c) left top / 20px 3px no-repeat, linear-gradient(#dd470c, #dd470c) left center / 3px 100% no-repeat, linear-gradient(#dd470c, #dd470c) left bottom / 20px 3px no-repeat, linear-gradient(#dd470c, #dd470c) right top / 20px 3px no-repeat, linear-gradient(#dd470c, #dd470c) right center / 3px 100% no-repeat, linear-gradient(#dd470c, #dd470c) right bottom / 20px 3px no-repeat;}
#point_three .ttl{font-size: 25px; position: relative; line-height: 1.3;}
#point_three .ttl::before{content: ""; position: absolute; left: -3%; width: 55px; height: 37px; background: url("../images/point_three_left.png"); z-index: 1; bottom: 0;}
#point_three .ttl::after{content: ""; position: absolute; right: -3%; width: 55px; height: 37px; background: url("../images/point_three_right.png"); z-index: 1; bottom: 0;}
#point_three .orangeBox::before{width: 35px; height: 35px;}
#point_three .orangeBox .subttl.white{width: 65%; font-size: 20px; margin-bottom: 0.5em;}
#point_three .orangeBox .more{font-size: 12px;}
#point_three .orangeBox .subttl.orange{font-size: 20px;}
#point_three .orangeBox .playerBox{display: block;}
#point_three .orangeBox .playerBox .leftBox{margin-bottom: 2em;}

/*#point_four*/
#point_four .contentsBoxInner{max-width: 90%;}
#point_four .bluekakko{width: 100%; max-width: 100%; background: linear-gradient(#009696, #009696) left top / 20px 3px no-repeat, linear-gradient(#009696, #009696) left center / 3px 100% no-repeat, linear-gradient(#009696, #009696) left bottom / 20px 3px no-repeat, linear-gradient(#009696, #009696) right top / 20px 3px no-repeat, linear-gradient(#009696, #009696) right center / 3px 100% no-repeat, linear-gradient(#009696, #009696) right bottom / 20px 3px no-repeat;}

/*#boshu*/
#boshu .contentsBoxInner{max-width: 90%;}
#boshu h3.ttl-h3{width: 100%}
#boshu .listBox li{padding: 0.5em 0; display: block;}
#boshu .listBox li .leftBox{font-size: 14px;}
#boshu .listBox li .rightBox{font-size: 12px;}
#boshu .listBox li .orange{font-size: 14px;}
#boshu .whiteBox .subttl{font-size: 22px; line-height: 1.4; padding-bottom: 10px;}
#boshu .whiteBox::before{content: none;}
#boshu .whiteBox::after{content: none;}
#boshu .whiteBox .innerBox{width: 85%;}
#boshu .btnBox{margin: 2em 0 0;}

/*#pageFooter*/
#pageFooter .footerInner{max-width: 90%;}
#pageFooter dl{display: block; padding: 0 1.5em;border-left: 7px #dd470c solid; border-right: 7px #dd470c solid;}
#pageFooter dt{font-size: 25px; padding: 0; border-left: none; border-right: none;}
#pageFooter dd{padding: 0; border-right: none;}
#pageFooter dd .bold{font-size: 15px;}
#pageFooter dd a{font-size: 15px;}
