@charset "utf-8";

/* main-visual */
.main-visual {margin-top:120px; position:relative;}
.main-visual .secting-img {display:block; height:100%;}
.main-visual .secting-img img {height:100%; object-fit:cover;}
.main-visual .m-secting-img {display:none;}
.main-visual .origin .item {position:relative; height:100vh;}
.main-visual .thumb {position:absolute; top:0; left:0; z-index:10; color:#fff; width:100%; height:100%;}
.main-visual .thumb .wrap {height:100%; display:flex; flex-direction:column; justify-content:center; max-width:1610px; width:100%; margin:0 auto; padding:0 15px;}
.main-visual .txt-box {margin-bottom:80px; padding-left:5px;}
.main-visual .txt-box p {font-size:23px; line-height:1.3em; opacity:0.6; font-weight:600; margin-bottom:30px; position:relative; top:50px; filter:blur(10px); opacity:0;}
.main-visual .txt-box h2 {font-size:68px; line-height:1.1em; font-family:'Montserrat'; position:relative; top:50px; filter:blur(10px); opacity:0;}
.main-visual .item.slick-active .txt-box p {top:0; filter:blur(0); transition:all 1s; opacity:.6;}
.main-visual .item.slick-active .txt-box h2 {top:0; filter:blur(0); transition:all 1s .6s; opacity:1;}
.main-visual .paging .slick-dots {width:100%; max-width:1610px; padding:0 15px; margin:0 auto; display:flex;}
.main-visual .paging .slick-dots li {padding-right:8px;}
.main-visual .paging .slick-dots li button {display:block; width:32px; height:6px; background:#fff; opacity:0.4; border-radius:3px; border:0; font-size:0; cursor:pointer;}
.main-visual .paging .slick-dots li.slick-active button {opacity:1; transition:all 0.4s;}
.scrolldown {position:absolute; right:60px; bottom:60px; width:30px; height:52px; border:1px solid #fff; border-radius:26px; display:block; z-index:20;}
.scrolldown span {background:#fff; width:6px; height:6px; border-radius:2px; display:block; position:absolute; left:50%; margin-left:-3px;}
.scrolldown span.span01 {top:13px; opacity:0.55; animation:flicker01 1s ease-in-out infinite both}
.scrolldown span.span02 {top:23px; opacity:0.8; animation:flicker02 1s ease-in-out infinite both}
.scrolldown span.span03 {top:33px; opacity:1; animation:flicker03 1s ease-in-out infinite both}
@keyframes flicker01 {0% {top:11px;}12.5% {top:15px;}37.5% {top:15px;}50% {top:15px;}65.5% {top:15px;}75% {top:15px;}87.5% {top:11px;}100% {top:11px;}}
@keyframes flicker02 {0% {top:21px;}12.5% {top:21px;}25% {top:25px;}37.5% {top:25px;}50% {top:25px;}65.5% {top:25px;}75% {top:21px;}87.5% {top:21px;}100% {top:21px;}}
@keyframes flicker03 {0% {top:31px;}12.5% {top:31px;}25% {top:31px;}37.5% {top:35px;}50% {top:35px;}65.5% {top:31px;}75% {top:31px;}87.5% {top:31px;}100% {top:31px;}}
/* section */
.sec-tit {margin-bottom:76px;}
.sec-tit h3 {font-size:65px; line-height:1.15em; color:#000; font-family:'Montserrat'; }
/* section01 */
.section01 {padding:156px 0 176px;}
.section01 .col {display:flex; align-items:center; margin:0 -30px 80px;}
.section01 .col:last-child {margin-bottom:0;}
.section01 .col:nth-child(even) {flex-direction:row-reverse;}
.section01 .col > div {width:50%; padding:0 30px;}
.section01 .img-box img {border-radius:30px; overflow:hidden;} 
.section01 .col > div.txt-box {padding:0 80px;}
.section01 .col:nth-child(even) .txt-box {text-align:right;}
.section01 .txt-box h4 {font-size:46px; line-height:1.1em; color:#120a8f; font-weight:600; margin-bottom:32px; display:inline-block; position:relative;}
.section01 .txt-box h4:after {content:''; width:0; height:3px; background:#120a8f; position:absolute; bottom:0; transition:all 0.6s;}
.section01 .col:nth-child(odd) .txt-box h4:after {left:0;}
.section01 .col:nth-child(even) .txt-box h4:after {right:0;}
.section01 .txt-box p {font-size:20px; line-height:1.6em; color:#666; margin-bottom:56px; transition:all 0.6s;}
.section01 .txt-box .more a {display:inline-block; padding:0 40px; width:200px; line-height:70px; border-radius:35px; background:#f6f6f6; transition:all 0.6s; font-size:18px; font-weight:600; color:#666; text-align:left; position:relative;}
.section01 .txt-box .more a:hover {background:#120a8f; color:#fff; padding:0 30px;}
.section01 .txt-box .more a:after {content:''; background-image:url('../img/main/sec-more.png'); width:24px; height:12px; position:absolute; top:50%; margin-top:-6px; right:30px; transition:all 0.6s; background-repeat:no-repeat; background-size:cover;}
.section01 .txt-box .more a:hover:after {background-image:url('../img/main/sec-more-on.png');}
.section01 .txt-box:has(.more a:hover) h4:after {width:100%;}
.section01 .txt-box:has(.more a:hover) p {color:#333;}
/* section02 */
.section02 {padding:0 0 176px;}
.section02 .col {display:flex; justify-content:center;}
.section02 .row {width:auto; padding:0 6px; position:relative;}
.section02 .row:after {content:''; position:absolute; top:94px; right:-16px; width:32px; height:32px; background:url('../img/main/sec02-arrow.png') no-repeat; background-size:cover; z-index:1;}
.section02 .row:last-child:after {display:none;}
.section02 .inner {height:100%; text-align:center;}
.section02 .inner .circle {width:216px; height:216px; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; background:#f6f6f6; border-radius:50%;}
.section02 .inner p {font-size: 16px; line-height:2em; color:#999; margin-bottom:2px; font-weight:700;}
.section02 .inner .icon {}
.section02 .inner h4 {font-size:24px; line-height:1.3em; color:#000; margin-top:26px;}
/* section03 */
.section03 {padding:200px 0; background:url('../img/main/sec03bg.jpg') center center no-repeat; background-size:cover;}
.section03 .col {display:flex; justify-content:space-between; align-items:flex-end;}
.section03 .sec-tit {margin-bottom:0;}
.section03 .sec-tit h3 {color:#fff;}
.section03 .sec-tit p {font-size:20px; line-height:1.6em; color:#fff; opacity:0.7; margin-top:24px;}
.section03 .more a {display:block; width:200px; line-height:66px; border:2px solid #120a8f; background:#120a8f; border-radius:35px; color:#fff; text-align:left; padding:0 40px; font-size:18px; font-weight:600; position:relative; transition:all 0.6s;}
.section03 .more a:hover {background:#fff; color:#120a8f; padding:0 30px;}
.section03 .more a:after {content:''; background-image:url('../img/main/sec-more-on.png'); width:24px; height:12px; position:absolute; top:50%; margin-top:-6px; right:30px; transition:all 0.4s; background-repeat:no-repeat; background-size:cover;}
.section03 .more a:hover:after {background-image:url('../img/main/sec-more-b.png');}