/* common */
.subpage { overflow: hidden; position:relative; text-align: center;}
.subpage > section {padding: 90px 0; position: relative; }
.subpage > section:nth-of-type(even) {background: #f7f7f7;}
.subpage > section article + article {margin-top: 90px;}
.sub_inner { max-width: 1400px; width: 100%; margin:0 auto; position: relative; padding:0 50px; }
.sub_tit {margin-bottom:50px;}

/* font size */
.fs_60 {font-size: 60px; font-weight: 700; color:#000; line-height: 1.2; letter-spacing: -1.2px;}
.fs_32 {font-size: 32px; font-weight: 700; color:#000; line-height: 1.3; letter-spacing: -.64px;}
.fs_27 {font-size: 27px; font-weight: 700; color:#000; line-height: 1.3; letter-spacing: -.54px;}
.fs_24 {font-size: 24px; font-weight: 700; color:#000; line-height: 1.3; letter-spacing: -.48px;}
.fs_18 {font-size: 18px; font-weight: 400; color:#333; line-height: 1.83; letter-spacing: -.36px;}

.arrow_tit {text-align: left; position: relative; padding-left: 28px; margin-bottom:35px;}
.arrow_tit::before {content: ''; display: block; width: 16px; height: 24px; background:url("../img/arrow_tit.png") 50%/contain no-repeat; position: absolute;
left: 0; top:8px; }

.dot_list > li {position: relative; padding-left:11px; margin-bottom:5px; text-align: left; }
.dot_list > li:last-child {margin-bottom: 0;}
.dot_list > li::before {content: ''; display: block; width: 5px; height: 5px; background-color: #0056c1; position: absolute; left: 0; top:12px; border-radius: 50%;}

/*Content CSS*/
#sec1 { z-index: 1; }
#sec1::before {content: ''; display: block; width: 100%; height: 670px; position: absolute; z-index: -1; left: 0; bottom: 0; background-color: #f7f7f7; }
#sec1 .sub_tit {text-align: left; }
#sec1 .txt_box {display: flex; align-items: center; padding: 50px 80px; border:3px solid #ddd; text-align: left; margin-bottom: 80px;background-color: #fff;}
#sec1 .txt_box h3 {font-weight: 400; flex-shrink: 0; margin-right: 50px; padding-right: 50px; border-right: 1px solid #ddd; }
#sec1 .list {display: flex;}
#sec1 .list > li {flex:1; border-left: 1px solid #ddd; padding: 30px 0;}
#sec1 .list > li:last-child {border-right: 1px solid #ddd;}
#sec1 .list i {display: inline-block; height: 67px; line-height: 67px; }
#sec1 .list h4 {display: flex; align-items: center; justify-content: center; font-size: 17px; font-weight: 600; color:#fff; line-height: 1; width: 50px; height: 24px;
background-color: #000; border-radius: 12px; margin: 30px auto 15px; font-family: 'Montserrat';}
#sec1 .list p {margin-top: 15px;}
/* hover */
#sec1 .list i img {transition: transform .5s; }
#sec1 .list li:hover i img {transform: rotateY(180deg);}

/* sec2 */
#sec2 { background-color: #fff; }
#sec2 .list {display: flex; justify-content: space-between;}
#sec2 .list > li {border:1px solid #ddd; border-top: 3px solid #000; width: 410px; position: relative;}
#sec2 .list h4 {width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; position: absolute; left: 0; top:-3px; background-color: #000;
font-size: 30px; font-weight: 800; color:#fff; font-family: 'Montserrat'; z-index: 2;}
#sec2 .list .img {overflow: hidden;}
#sec2 .list .img img {transition: transform .3s;}
#sec2 .list > li:hover .img img {transform: scale(1.05);}
#sec2 .list .txt {padding: 35px; text-align: left; }
#sec2 .list .txt p {margin-top: 10px; }

/* sec3 */
#sec3 {background:url("../img/bu1_s3_bg.jpg") 50%/cover no-repeat; padding: 105px 0 115px;}
#sec3 h3 {color:#fff; border-bottom: 1px solid rgba(255,255,255,.2); margin-bottom: 50px; padding-bottom: 45px; }
#sec3 h3::before {content: ''; display: block; background:url("../img/bu1_s3_arrow.png") 50% no-repeat; width: 24px; height: 16px; margin: 0 auto 12px;}
#sec3 p {color:rgba(255, 255, 255, 0.8); line-height: 1.72;}
#sec3 h4 {color:#fff; font-weight: 400; margin-top: 20px;}












@media screen and (max-width: 1400px) {


}