@charset "utf-8";
#sub_layout{margin-bottom: 170px;}
.sub_6_1_ .lnb-wrap{display: none;}


.sub-visual{position: relative; height: 450px;}
.sub-visual .sv{width: 100%; height: 100%;}
.sub-visual .sv img{width: 100%; height: 100%; object-fit:cover; }
.sub-visual .sv-tbx{position: absolute; left: 50%; translate:-50% 0; top: 0; width: 100%; height: 100%; display: flex; justify-content: center; flex-direction: column; text-align: center; padding-top: 40px;}
.sub-visual .sv-tbx .sv-tit{font-size: 50px; line-height: 1; color: #fff; letter-spacing: -0.02em; font-weight: 700; }
.lnb-wrap{position: relative; border-bottom: 1px solid #ddd; margin-top: -60px; background: #fff;}
.lnb-wrap .lnb ul {display: flex; flex-wrap:wrap; }
.lnb-wrap .lnb ul > li{position: relative; flex:1; }
.lnb-wrap .lnb ul > li:not(:last-child):after{position: absolute; content: ''; width: 1px; height: 18px; background: #ddd; right: 0; top: 50%; margin-top: -9px;}
.lnb-wrap .lnb ul > li > a{position: relative; height: 60px; font-size: 18px; line-height: 1.5; color: #666; font-weight: 700; letter-spacing: -0.02em; text-align: center; align-content:center; transition:.3s;}
.lnb-wrap .lnb ul > li > a:after{position: absolute; content: ''; width: 0%; height: 3px; left: 50%; bottom: -1px; background: #37b6ff; transition:.3s;}
.lnb-wrap .lnb ul > li.current > a{color: #37b6ff;}
.lnb-wrap .lnb ul > li.current > a:after{width: 100%; left: 0;}
.lnb-wrap .lnb ul > li:hover > a{color: #37b6ff;}
.lnb-wrap .lnb ul > li:hover > a:after{width: 100%; left: 0;}
.sub-tit{text-align: center; margin-top: 100px; margin-bottom: 53px;}
.sub-tit h4{position: relative; font-size: 45px; line-height: 1; letter-spacing: -0.02em; color: #000; font-weight: 700; padding-top: 32px; margin-bottom: 39px;}
.sub-tit h4:after{position: absolute; content: ''; width: 37px; height: 6px;background: #37b6ff; left: 50%; top: 0; margin-left: -18px;}
.sub-tit p{font-size: 20px; line-height: 30px; letter-spacing: -0.02em; color: #666; }

/* s11 */
.s11 .arti1{background: url(../img/sub/s11-1.jpg) center / cover no-repeat; height: 340px; align-content:center; padding: 0 100px; }
.s11 .arti1 .tbx {padding-bottom: 10px;}
.s11 .arti1 .tbx strong{display: block; font-size: 46px; line-height: 1.5; letter-spacing: -0.02em; color: #fff; font-weight: 700; margin-bottom: 20px;}
.s11 .arti1 .tbx p{font-size: 18px; line-height: 30px; letter-spacing: -0.02em; color: #fff; font-weight: 500;}
.s11 .arti2 {position: relative; display: flex; flex-direction: column; gap:90px; margin-top: 120px;}
.s11 .arti2:before{position: absolute; content: ''; width: 1px; height: 100%; background: #ddd; right: 50%; top: 0;}
.s11 .arti2 .box{position: relative; display: flex; flex-wrap:wrap; }
.s11 .arti2 .box:not(:last-child):after{position: absolute; content: ''; width: 33px; height: 50px; background: #fff url(../img/sub/s11-4.jpg) center no-repeat; left: 50%; bottom: -70px; margin-left: -17px;}
.s11 .arti2 .box > *{width: 50%; padding: 0 110px; box-sizing: border-box;}
.s11 .arti2 .box > figure{padding-left: 0;}
.s11 .arti2 .box > .tbx{align-content:center; padding-right: 0; padding-top: 6px;}
.s11 .arti2 .box > .tbx small{display: block; font-size: 16px; line-height: 1; letter-spacing: -0.02em; color: #37b6ff; font-weight: 800;}
.s11 .arti2 .box > .tbx b{display: block; font-size: 34px; line-height: 46px; letter-spacing: -0.02em; color: #000; font-weight: 700; margin: 20px 0 37px;}
.s11 .arti2 .box > .tbx p{font-size: 18px; line-height: 30px; letter-spacing: -0.02em; color: #666;}
.s11 .arti2 .box:nth-child(even){flex-direction: row-reverse;}
.s11 .arti2 .box:nth-child(even) > figure{padding-right: 0; padding-left: 110px;}
.s11 .arti2 .box:nth-child(even) > .tbx {text-align: right; padding-left: 0; padding-right: 110px;}

/* s12 */
.s12 .arti1 iframe{width: 100%; height: 500px;}
.s12 .arti2{display: flex; flex-wrap:wrap; justify-content: space-between; margin-top: 34px;}
.s12 .arti2 ul > li{display: flex; flex-wrap:wrap; font-size: 18px; line-height: 34px; letter-spacing: -0.02em; color: #666; }
.s12 .arti2 ul > li span{font-weight: 700; color: #000; width: 118px;}
.s12 .arti2 ul > li p{flex:1;}
.s12 .arti2 ol{display: flex; gap:10px; margin-top: 7px;}
.s12 .arti2 ol > li > a{width: 210px; height: 70px; background: #333; font-size: 20px; line-height: 1; letter-spacing: -0.02em; color: #fff; text-align: center; align-content:center; transition:.3s;}
.s12 .arti2 ol > li:first-child > a{background: #37b6ff;}
.s12 .arti2 ol > li:hover > a{opacity: 0.9;}


/* s5 */	
.s5-col2{display: flex; flex-wrap:wrap; gap:40px}
.s5-col2 > li{flex:1 1 40%}
.s5-col2 > li .tbx{border-bottom: 1px solid #ddd; height: 60px; align-content:center;}
.s5-col2 > li .tbx p{font-size: 20px; line-height: 1.5; letter-spacing: -0.02em; color: #000; font-weight: 700; }
.s5-col2 > li .tbx p span{color: #37b6ff;}

/* s51 */
.s51 .arti1{display: flex; flex-wrap:wrap;     flex-direction: column; gap:60px}
.s51 .arti1 ul{position: relative; display: flex; flex-wrap:wrap; gap:60px; }
.s51 .arti1 ul > li{position: relative; flex:1; height: 240px;  box-sizing: border-box; border: 6px solid #d7d8da; align-content:center; text-align: center; padding-bottom: 6px;}
.s51 .arti1 ul > li figure{position: relative; z-index: 10;}
.s51 .arti1 ul > li p{font-size: 20px; line-height: 1.5; letter-spacing: -0.01em; color: #000; font-weight: 700; margin-top: 13px;}
.s51 .arti1 ul > li .step{position: absolute; width: 90px; height: 90px; align-content:center; text-align: center; background: #fff; left: -6px; top: -6px;}
.s51 .arti1 ul > li .step small{display: block;font-size: 16px; line-height: 1; letter-spacing: 0; color: #37b6ff; font-weight: 800; margin-bottom: 2px;}
.s51 .arti1 ul > li .step big{display: block;font-size: 40px; line-height: 1; letter-spacing: -0.01em; color: #37b6ff; font-weight: 800; }
.s51 .arti1 ul.re{flex-direction: row-reverse;}
.s51 .arti1 ul:first-child > li:last-child:after{position: absolute; content: ''; width: 60px; height: 100%; background: url(../img/sub/s51-arr.png) center no-repeat;	left:50%; bottom:-149px; rotate:90deg; margin-left: -30px;}
.s51 .arti1 ul > li:not(:last-child):after{position: absolute; content: ''; width: 60px; height: 100%; background: url(../img/sub/s51-arr.png) center no-repeat; right: -66px; top: 0;} 
.s51 .arti1 ul.re > li:not(:last-child):after{right: auto; left: -66px; top: 0; rotate:180deg;} 

/* s52 */
.s52-tab{display: flex; flex-wrap:wrap; width: 100%; margin-bottom: 60px;}
.s52-tab > li{flex:1; height: 55px; border: 1px solid #ddd; border-right: 0; align-content:center; font-size: 18px; line-height: 1; letter-spacing: -0.02em; color: #666; text-align: center; transition:.3s; font-weight: 600; cursor: pointer;}
.s52-tab > li.on{background: #000; color: #fff;}
.s52-tab > li:last-child{border-right: 1px solid #ddd;}
.s52 .arti2 .box{display: none;}
.s52 .arti2 .box:nth-child(1){display: block;}