@charset "utf-8";

.main-visual {position: relative; max-width: 1790px; width: 100%; height: 720px; margin: 222px auto 0; padding: 0 15px;}
.main-visual .item {position: relative; width: 100%; height: 720px; border-radius: 25px; overflow: hidden;}
.main-visual .item .img-box {position: absolute; top: 0; left: 0; z-index: -1; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center center; background-size: cover; border-radius: 25px; overflow: hidden;}
.main-visual .item .img-box01 {background-image: url('../img/main/main-visual01.jpg');}
.main-visual .item .img-box02 {background-image: url('../img/main/main-visual02.jpg');}
.main-visual .item .img-box03 {background-image: url('../img/main/main-visual03.jpg');}
.main-visual .item .img-box04 {background-image: url('../img/main/main-visual04.jpg');}
.main-visual .item.slick-active .img-box {transform: scale(1.06); transition: all 4.5s;}
.main-visual .item .text-box {position: relative; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; z-index: 10; text-align: center; margin-top: -12px;}
.main-visual .item .text-box h2 {display: inline-block; font-family: 'SUITE', sans-serif; font-size: 70px; font-weight: 600; line-height: 1.3em; color: #fff; text-align: center;}
.main-visual .item .text-box h2 span {display: inline-block; width: 33px; height: 27px; background-repeat: no-repeat; margin-bottom: 30px;}
.main-visual .item .text-box h2 span:nth-child(1) {background-image: url('../img/main/main-visual-text01.png'); background-position: left top; margin-right: 28px;}
.main-visual .item .text-box h2 span:nth-child(2) {background-image: url('../img/main/main-visual-text02.png'); background-position: right top; margin-left: 24px;}
.main-visual .item.slick-active .text-box h2 {animation: text-up 1.8s both 0.5s;}
@keyframes text-up {0% {transform: translateY(50px); opacity: 0;} 100% {transform: translateY(0px); opacity: 1;}}
.main-visual .arrows {position: absolute; bottom: 60px; right: 60px;}
.main-visual .slick-arrow {width: 75px; height: 75px; border-radius: 50%; border: 2px solid rgba(255,255,255,0.3); background: transparent; font-size: 0; background-repeat: no-repeat; background-position: center center; transition: all 0.4s;}
.main-visual .slick-prev {background-image: url('../img/main/main-visua-prev-btn.png'); margin-right: 5px;}
.main-visual .slick-next {background-image: url('../img/main/main-visua-next-btn.png');}
.main-visual .slick-arrow:hover {background-color: rgba(255,255,255,0.15);}
.main-visual .scroll-down {position: absolute; bottom: 60px; left: 60px;}
.main-visual .scroll-down a {display: flex; align-items: center; font-size: 14px; color: #fff;}
.main-visual .scroll-down a img {padding-right: 11px;}
.main-visual .scroll-down a img {animation: bounce 1.2s ease-in-out infinite both}
@keyframes bounce {0%,100% {transform: translateY(0)} 50% {transform: translateY(8px)}}

/* common */
.sec-title b {position: relative; display: block; font-size: 28px; font-weight: 600; line-height: 1.3em; color: #0065b5; padding-top: 33px; margin-bottom: 32px;}
.sec-title b:before {position: absolute; top: 0; left: 0; content: ''; width: 18px; height: 18px; background-image: url('../img/main/section-title-icon.png'); background-repeat: no-repeat; background-position: left center;}
.sec-title h3 {font-family: 'SUITE', sans-serif; font-weight: 600; font-size: 60px; line-height: 1.36em; letter-spacing: -0.03em; color: #111;}
.sec-title h3 span {display: inline-block; width: 18px; height: 18px; background-image: url('../img/main/section-title-icon.png'); background-repeat: no-repeat; background-position: right bottom; margin-left: 16px; margin-bottom: -5px;}
.sec03 .sec-title h3 span, .sec06 .sec-title h3 span {background-image: url('../img/main/section-title-icon02.png'); margin-left: 18px;}
.sec-title.white h3 {color: #fff; margin-bottom: 22px;}
.sec-title.white p {font-family: 'SUITE', sans-serif; font-size: 18px; line-height: 1.77em; color: rgba(255,255,255,0.8);}
.sec07 .sec-title h3 {position: relative; padding-top: 20px;}
.sec07 .sec-title h3:before {position: absolute; top: 0; left: 0; content: ''; width: 18px; height: 17px; background-image: url('../img/main/section-title-icon03.png'); background-repeat: no-repeat; background-position: left center;}

.sec01 {padding: 160px 0 180px;}	
.sec01 .wrap {display: flex;}
.sec01 .box01 {max-width: 540px; width: 100%;}
.sec01 .box02 {width: 1%; flex: 1 1 auto; padding-left: 120px; margin-top: 25px;}
.sec01 .box02 .text-box p {font-size: 26px; line-height: 1.84em; color: #666; margin-top: 45px; margin-bottom: 88px;}
.sec01 .box02 .img-box {text-align: right;}
.sec01 .img-box img {border-radius: 25px; overflow: hidden; box-shadow: 0px 1px 10px 0px rgba(0, 0, 0, 0.1);}

.sec02 {padding: 180px 0 200px; background: #f9f9f9;}
.sec02 .wrap {display: flex;}
.sec02 .title-wrap {display: flex; flex-direction: column; justify-content: space-between; max-width: 620px; width: 100%;}
.sec02 .sec-title {margin-top: -13px;}
.sec02 .more-btn {width: 259px; height: 230px; background-image: url('../img/main/sec02-btn.png'); background-repeat: no-repeat; background-position: left bottom; transition: all 0.4s;}
.sec02 .more-btn a {width: 100%; height: 100%; font-size: 24px; line-height: 1.5em; color: #fff; padding: 37px 50px;}
.sec02 .more-btn a span {font-weight: 700;}
.sec02 .more-btn:hover {background-image: url('../img/main/sec02-btn-on.png');}
.sec02 .info-wrap {width: 1%; flex: 1 1 auto;}
.sec02 .info-wrap dl {display: flex; align-items: center; width: 100%; height: 150px; border-bottom: 1px solid #ddd; padding: 0 50px;}
.sec02 .info-wrap dl:nth-child(1) {border-top: 2px solid #0065b5;}
.sec02 .info-wrap dt {font-size: 32px; font-weight: 500; line-height: 1.25em; color: #111; text-align: center; padding-right: 100px;}
.sec02 .info-wrap dd {font-size: 20px; line-height: 1.5em; color: #333;}
.sec02 .info-wrap dd span {display: block; font-size: 18px; color: #666; margin-top: 5px;}

.sec03 {padding: 145px 0 180px;}
.sec03 .sec-title {margin-bottom: 88px;}
.sec03 ul {display: flex; margin: 0 -11px;}
.sec03 ul li {width: 20%; padding: 0 11px;}
.sec03 ul li a {position: relative; width: 100%; height: 365px; border-radius: 25px; padding: 55px 5px 40px 50px; overflow: hidden; background-repeat: no-repeat; background-position: center center; box-shadow: 0px 1px 10px 0px rgba(0, 0, 0, 0.1);}
.sec03 ul li:nth-child(even) a {margin-top: 85px;}
.sec03 ul li a:after {position: absolute; bottom: -100%; left: 0; content: ''; width: 100%; height: 100%; background-image: url('../img/main/sec03-bg.png'); background-repeat: no-repeat; background-position: center bottom; transition: all 0.6s;}
.sec03 ul li:nth-child(1) a {background-image: url('../img/main/sec03-img01.jpg');}
.sec03 ul li:nth-child(2) a {background-image: url('../img/main/sec03-img02.jpg');}
.sec03 ul li:nth-child(3) a {background-image: url('../img/main/sec03-img03.jpg');}
.sec03 ul li:nth-child(4) a {background-image: url('../img/main/sec03-img04.jpg');}
.sec03 ul li:nth-child(5) a {background-image: url('../img/main/sec03-img05.jpg');}
.sec03 ul li a .text-box {position: relative; width: 100%; height: 100%; z-index: 3; transition: all 0.6s;}
.sec03 ul li a b {display: block; font-size: 26px; font-weight: 600; color: #fff; margin-bottom: 15px; transition: all 0.6s;}
.sec03 ul li a h4 {font-size: 24px; font-weight: 400; line-height: 1.4em; color: #fff; margin-bottom: 25px; transition: all 0.6s;}
.sec03 ul li a p {opacity: 0; position: relative; font-size: 16px; line-height: 1.5em; color: #fff; padding-top: 20px; transition: all 0.6s;}
.sec03 ul li a p:before {opacity: 0; position: absolute; top: 0; left: 0; content: ''; width: 15px; height: 12px; background-image: url('../img/main/sec03-text.png'); background-repeat: no-repeat; background-position: left top; transition: all 0.6s;}
.sec03 ul li a .btn {opacity: 0; position: absolute; bottom: -10px; right: 35px; width: 17px; height: 17px; z-index: 3; transition: all 0.6s;}
.sec03 ul li a:hover:after {bottom: 0;}
.sec03 ul li a:hover .text-box {margin-top: -50px;}
.sec03 ul li a:hover b {opacity: 0;}
.sec03 ul li a:hover h4 {font-weight: 600;}
.sec03 ul li a:hover p {opacity: 0.8;}
.sec03 ul li a:hover p:before {opacity: 1;}
.sec03 ul li a:hover .btn {opacity: 1; bottom: 40px;}

.sec04 {padding: 160px 0; background: #f9f9f9;}
.sec04 .sec-title {margin-bottom: 90px;}
.sec04 .wrap {display: flex; justify-content: space-between;}
.sec04 .text-box {padding-right: 100px;}
.sec04 .text-box ul {display: flex; flex-wrap: wrap; margin: -10px;}
.sec04 .text-box ul li {width: 50%; padding: 10px;}
.sec04 .text-box ul li:nth-child(3) {width: 100%;}
.sec04 .text-box ul li .inner {position: relative; height: 100%; border: 1px solid #ddd; border-radius: 25px; text-align: center; padding: 43px 15px 34px;}
.sec04 .text-box ul li:nth-child(1) .inner {min-height: 165px;}
.sec04 .text-box ul li .title {position: absolute; top: -12px; left: 50%; transform: translateX(-50%);}
.sec04 .text-box ul li .title h4 {position: relative; display: inline-block; font-size: 16px; font-weight: 600; line-height: 1.3em; color: #0065b5; background: #f9f9f9; padding: 0 19px;}
.sec04 .text-box ul li .title h4:before {position: absolute; top: 50%; margin-top: -4px; left: 0; content: ''; width: 5px; height: 5px; background: #0065b5; border-radius: 50%;}
.sec04 .text-box ul li .title h4:after {position: absolute; top: 50%; margin-top: -4px; right: 0; content: ''; width: 5px; height: 5px; background: #0065b5; border-radius: 50%;}
.sec04 .text-box ul li p {font-size: 20px; font-weight: 500; line-height: 1.6em; color: #333;} 
.sec04 .text-box ul li.mail p:last-child {position: relative; margin-top: 13px; padding-top: 14px;}
.sec04 .text-box ul li.mail p:last-child:before {position: absolute; top: 0; left: 50%; margin-left: -15px; content: ''; width: 30px; height: 1px; background: #ddd;}
.sec04 .text-box ul li.tel p a {font-size: 24px; font-weight: 600;}
.sec04 .text-box ul li.mail p a {font-weight: 400;}
.sec04 .text-box .notice {margin-top: 20px;}
.sec04 .text-box .notice a {font-size: 18px; line-height: 1.77em; color: #555; text-align: center; border: 1px solid #ddd; border-radius: 15px; padding: 10px 0;}
.sec04 .text-box .notice a:hover {color: #0065b5; border: 1px solid #0065b5; font-weight: 500; transition: all 0.8s;}
.sec04 .img-box {max-width: 648px; width: 100%;}

.sec05 {padding: 160px 0 167px;}
.sec05 .sec-title {margin-bottom: 84px;}
.sec05 ul {display: flex; margin: -10px;}
.sec05 ul li {width: 25%; padding: 10px;}
.sec05 ul li a {position: relative; display: flex; flex-direction: column; justify-content: space-between; min-height: 210px; height: 100%; background: #f9f9f9; border: 1px solid #f9f9f9; border-radius: 25px; padding: 35px 30px 35px 40px; transition: all 0.6s;}
.sec05 ul li a:hover {box-shadow: 0px 9px 10px 0px rgba(165, 160, 160, 0.1);}
.sec05 ul li a.open:hover {background: #fff; border: 1px solid #0065b5;}
.sec05 ul li a.closed:hover {background: #fff; border: 1px solid #86949e;}
.sec05 ul li .status {opacity: 0; position: absolute; top: -14px; right: 32px; width: 100px; line-height: 50px; font-size: 16px; font-weight: 500; color: #fff; text-align: center; border-radius: 15px; transition: all 0.3s;}
.sec05 ul li:hover .status {opacity: 1;}
.sec05 ul li a.open .status {background: #0065b5;}
.sec05 ul li a.closed .status {background: #86949e;}
.sec05 ul li .icon {width: 90px; height: 90px; background-repeat: no-repeat; background-position: left top; transition: all 0.6s;}
.sec05 ul li:nth-child(1) .icon {background-image: url('../img/main/sec05-icon01.png');}
.sec05 ul li:nth-child(2) .icon {background-image: url('../img/main/sec05-icon02.png');}
.sec05 ul li:nth-child(3) .icon {background-image: url('../img/main/sec05-icon03.png');}
.sec05 ul li:nth-child(4) .icon {background-image: url('../img/main/sec05-icon04.png');}
.sec05 ul li:nth-child(1) a.open:hover .icon {background-image: url('../img/main/sec05-icon01-open.png');}
.sec05 ul li:nth-child(2) a.open:hover .icon {background-image: url('../img/main/sec05-icon02-open.png');}
.sec05 ul li:nth-child(3) a.open:hover .icon {background-image: url('../img/main/sec05-icon03-open.png');}
.sec05 ul li:nth-child(4) a.open:hover .icon {background-image: url('../img/main/sec05-icon04-open.png');}
.sec05 ul li:nth-child(1) a.closed:hover .icon {background-image: url('../img/main/sec05-icon01-closed.png');}
.sec05 ul li:nth-child(2) a.closed:hover .icon {background-image: url('../img/main/sec05-icon02-closed.png');}
.sec05 ul li:nth-child(3) a.closed:hover .icon {background-image: url('../img/main/sec05-icon03-closed.png');}
.sec05 ul li:nth-child(4) a.closed:hover .icon {background-image: url('../img/main/sec05-icon04-closed.png');}
.sec05 ul li .text {text-align: right;}
.sec05 ul li .text h4 {position: relative; font-size: 24px; font-weight: 600; line-height: 1.4em; color: #111; padding-right: 30px; transition: all 0.6s;}
.sec05 ul li a.closed:hover .text h4 {color: #86949e;}
.sec05 ul li .text h4:after {opacity: 0; position: absolute; bottom: 7px; right: 0; content: ''; width: 17px; height: 17px; background-repeat: no-repeat; background-position: right center; transition: all 0.6s;}
.sec05 ul li a.open:hover .text h4:after {opacity: 1; background-image: url('../img/main/sec05-arrow-open.png');}
.sec05 ul li a.closed:hover .text h4:after {opacity: 1; background-image: url('../img/main/sec05-arrow-closed.png');}

.sec06 {padding-bottom: 180px;}
.sec06 .wrap {display: flex;}
.sec06 .title {max-width: 510px; width: 100%;}
.sec06 .img-box {position: relative; margin-top: -23px;}
.sec06 .img-box img.mob-only {display: none;}
.sec06 .img-box a {position: absolute; bottom: 45px; right: 80px;}
.sec06 .info-wrap {width: 1%; flex: 1 1 auto; padding-left: 80px; margin-top: 13px;}
.sec06 .info > h4 {font-family: 'SUITE', sans-serif; font-size: 45px; font-weight: 600; line-height: 1.5em; color: #111; margin-bottom: 18px;}
.sec06 .info > p {font-size: 18px; line-height: 1.77em; color: #666; margin-bottom: 52px;}
.sec06 .info > p span {font-weight: 700; color: #0065b5;}
.sec06 .info {margin-bottom: 50px;}
.sec06 .info ul {display: flex; margin: -10px;}
.sec06 .info ul li {width: 33.333%; padding: 10px;}
.sec06 .info ul li .inner {height: 100%; border: 1px solid #ddd; border-radius: 25px; padding: 50px 31px 60px; text-align: center; transition: all 0.6s;}
.sec06 .info ul li:nth-child(1) .inner:hover {border: 1px solid #0065b5;}
.sec06 .info ul li:nth-child(2) .inner:hover {border: 1px solid #77b500;}
.sec06 .info ul li:nth-child(3) .inner:hover {border: 1px solid #86949e;}
.sec06 .info ul li .icon {width: 122px; height: 122px; background-repeat: no-repeat; background-position: center center; margin: 0 auto 21px;}
.sec06 .info ul li:nth-child(1) .icon {background-image: url('../img/main/sec06-icon01.png');} 
.sec06 .info ul li:nth-child(2) .icon {background-image: url('../img/main/sec06-icon02.png');}
.sec06 .info ul li:nth-child(3) .icon {background-image: url('../img/main/sec06-icon03.png');}
.sec06 .info ul li b {display: block; font-family: 'poppins'; font-size: 22px; font-weight: 500; line-height: 1.45em; color: #111; margin-bottom: 17px; transition: all 0.6s;}
.sec06 .info ul li:nth-child(1) .inner:hover b {color: #0065b5;}
.sec06 .info ul li:nth-child(2) .inner:hover b {color: #77b500;}
.sec06 .info ul li:nth-child(3) .inner:hover b {color: #86949e;}
.sec06 .info ul li p {font-size: 18px; line-height: 1.4em; color: #666;}
.sec06 .link ul {display: flex; flex-wrap: wrap; align-items: center; border-top: 2px solid #0065b5; border-bottom: 1px solid #111;}
.sec06 .link ul li {width: 50%; height: 95px; padding: 0 40px; border-bottom: 1px solid #ddd;}
.sec06 .link ul li a {display: flex; justify-content: space-between; align-items: center; height: 100%; font-family: 'poppins'; font-size: 26px; font-weight: 400; line-height: 1.4em; color: #333; transition: all 0.6s;}
.sec06 .link ul li a:hover {font-weight: 500; color: #0065b5;}
.sec06 .link ul li .btn {width: 16px; height: 16px; background-image: url('../img/main/sec06-link-more-btn.png'); background-repeat: no-repeat; background-position: right center; transition: all 0.6s;}
.sec06 .link ul li a:hover .btn {background-image: url('../img/main/sec06-link-more-btn-on.png');}

.sec07 {width: 100%; height: 460px; background: url('../img/main/sec07-bg.jpg') no-repeat center center / cover; margin-top: 320px;}
.sec07 .wrap {position: relative; display: flex; justify-content: space-between; padding-top: 120px; order: 2;}
.sec07 .sec-title {max-width: 305px; width: 100%;}
.sec07 .title {display: flex; justify-content: space-between; align-items: center; }
.sec07 .title a {width: 80px; height: 80px; border-radius: 50%; background-color: rgba(255,255,255,0.1); background-image: url('../img/main/more-btn-wh.png'); background-repeat: no-repeat; background-position: center center; transition: all 0.4s;}
.sec07 .title a:hover {background-color: rgba(255,255,255,0.3);}
.sec07 .arrows {margin-top: 40px;}
.sec07 .slick-arrow {width: 60px; height: 60px; border-radius: 50%; background-repeat: no-repeat; background-position: center center; background-color: rgba(255,255,255,0.2); font-size: 0; border: none; transition: all 0.4s;}
.sec07 .slick-prev {background-image: url('../img/main/sec07-prev-btn.png'); margin-right: 5px;}
.sec07 .slick-next {background-image: url('../img/main/sec07-next-btn.png');}
.sec07 .slick-arrow:hover {background-color: rgba(255,255,255,0.4);}
.sec07 .slide {position: absolute; top: -310px; left: 610px; max-width: 1130px; width: 100%; opacity: 1;}
.sec07 .slide .items {overflow: hidden; margin: -20px;}
.sec07 .slide .item {padding: 20px;} 
.sec07 .slide .item a {position: relative; background: #fff; border-radius: 25px; overflow: hidden; box-shadow: 0px 1px 20px 0px rgba(32, 38, 53, 0.1); padding: 55px 50px 66px;}
.sec07 .slide .item a:before {opacity: 0; position: absolute; bottom: 0; left: 0; content: ''; width: 100%; height: 100%; background-image: url('../img/main/sec07-slide-bg.png'); background-repeat: no-repeat; background-position: center center; background-size: cover; z-index: 3; transition: all 0.8s;}
.sec07 .slide .item h4 {font-size: 24px; font-weight: 600; line-height: 1.4em; color: #111; height:calc(1.4em * 1 * 2); overflow:hidden; text-overflow:ellipsis; word-break:break-all; white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;} 
.sec07 .slide .item p {font-size: 16px; line-height: 1.62em; color: #111; opacity: 0.8; padding-top: 30px; margin-top: 30px; border-top: 1px solid #ddd; height:calc(1.62em * 1 * 7); overflow:hidden; text-overflow:ellipsis; word-break:break-all; white-space:normal; display:-webkit-box; -webkit-line-clamp:6; -webkit-box-orient:vertical;}
.sec07 .slide .item .btn {opacity: 0; position: absolute; bottom: 23px; left: 50px; display: inline-block; font-size: 26px; font-weight: 600; line-height: 1.4em; color: #fff; padding-right: 30px; z-index: 5; transition: all 0.6s;}
.sec07 .slide .item .btn:after {position: absolute; bottom: 7px; right: 0; content: ''; width: 17px; height: 17px; background-image: url('../img/main/more-btn-wh.png'); background-repeat: no-repeat; background-position: right center;}
.sec07 .slide .item a:hover:before {opacity: 1;}
.sec07 .slide .item a:hover .btn {opacity: 1; bottom: 63px;}