/* common */
.subpage { overflow: hidden; position:relative; text-align: center; }
.subpage > section {padding-top: 50px;}
.subpage > section >article:nth-of-type(even)  {background: #f7f7f7; padding: 50px 20px;}
.subpage article + article {margin-top: 50px;}
.sub_inner { max-width: 1400px; width: 100%; margin:0 auto; position: relative; padding:0 20px; }
.sub_title::before {content: ''; display: block; width: 50px; height: 4px; background-color: #f7941d; margin:0 auto 15px; }
.left_line {padding-left: 12px; position: relative; text-align: left; }
.left_line::before {content: ''; display: block; width: 3px; height: 20px; background-color: #f7941d; position: absolute; left:0; top:6px; }

/* fs */
.fs_60 {font-size: 28px; font-weight: 700; color:#000; line-height: 1.1; }
.fs_40 {font-size: 25px; font-weight: 600; color:#000; line-height: 1.3; }
.fs_34 {font-size: 20px; font-weight: 600; color:#000; line-height: 1.5; }
.fs_30 {font-size: 19px; font-weight: 600; color:#000; line-height: 1.5; }
.fs_24 {font-size: 17px; font-weight: 700; color:#000; line-height: 1.5; }
.fs_20 {font-size: 16px; font-weight: 600; color:#000; line-height: 1.5; }
.fs_18 {font-size: 14px; font-weight: 300; color:#333; line-height: 1.5; }

.dot_list li {position: relative; padding-left: 10px; text-align: left; }
.dot_list li::before {content: ''; display: block; width: 3px; height: 3px; position: absolute; left: 0; top:8px; background: #666; }
.dot_list li:nth-child(n+2) {margin-top: 8px; }

.video_wrap {width: 100%; position: relative; height:0; padding-bottom: 56.25%; margin-top: 40px;}
.video_wrap div {position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #f7f7f7; display: flex; align-items: center; justify-content: center;}
.video_wrap iframe {position: absolute; left: 0; top: 0; width: 100%; height: 100%;}


/*Content CSS*/

#sec1 .txt_box_wrap  {margin-top: 40px;}
#sec1 article + article .txt_box_wrap {margin-top: 0;}
#sec1 .txt_box_wrap > h3 {width: 100%; color:#fff; background-image: linear-gradient(to right, #f7941c, #f16021); padding: 7px 0; }
#sec1 .txt_box_wrap .box_wrap {width: 100%; background-color: #fff; border:1px solid #ddd; border-top: 0; padding: 0 20px; }
#sec1 .txt_box_wrap .box_wrap .box {padding: 20px 0; border-bottom: 1px solid #ddd; }
#sec1 .txt_box_wrap .box_wrap .box:last-child {border-bottom: 0;}
#sec1 .txt_box_wrap .box_wrap h4 {margin:0 0 15px;}

/* .bg{background-color: #f7f7f7; width: 100%; height: 270px; position: absolute; top: -270px; left: 0; z-index: -1;} */

#sec1 .list {display: flex; flex-direction: column; justify-content: space-between; margin-top: 55px; }
#sec1 .list li {width: 230px; position: relative; margin: 0 auto 70px;}
#sec1 .list li:last-child{margin-bottom: 0;}
#sec1 .list li::before {content: ''; display: block; padding-bottom: 100%; }
#sec1 .list li > div {width: 100%; height: 100%; position: absolute; left: 0; top:0; border-radius: 50%; background-color: #fff; display: flex; flex-direction: column;
align-items: center; border:5px solid #6a6a6a; box-shadow: 13.2px 12.3px 10px 0 rgba(0, 0, 0, 0.11); padding: 33px 0 0;}
#sec1 .list li i {position: absolute; right: -110px; top: 50%;  transform: translateY(-50%); }

#sec1 .list li:nth-of-type(-n+2) > div::after{width: 22px; height: 44px; background-image: url('../img/s1_arrow.png'); display: block; content: ''; position: absolute; top: calc(100% + 17px); transform: rotate(90deg); background-size: cover; background-position: center;}
#sec1 .list li h4 {color:#f7f7f7; width: 80px; line-height: 30px; height: 30px; background-color: #6a6a6a; border-radius: 19px;}
#sec1 .list li h3 {margin:30px 0 5px;}
#sec1 .list li:nth-child(2) > div {border-color: #f68e1d;}
#sec1 .list li:nth-child(2) h4 {background-color: #f68e1d;}
#sec1 .list li:nth-child(3) > div {border-color: #f26620;}
#sec1 .list li:nth-child(3) h4 {background-color: #f26620;}

/* sec2 */
#sec2 {background:url("../img/s2_bg.jpg") 50%/cover no-repeat; padding: 50px 0;}
#sec2 article {display: flex; align-items: center; flex-direction: column;}
#sec2 .img {border:1px solid rgba(255,255,255,.5); padding: 10px; }
#sec2 .txt {text-align: left; }
#sec2 .txt h2 {color:#fff; text-align: center;}
#sec2 .txt h2 span {font-size: 20px;}
#sec2 .txt h2::before {content: ''; display: block; width: 50px; height: 4px; background-color: #fff; margin: 30px auto 20px; }
#sec2 .txt p {color:#fff; margin-top: 15px; text-align: center;}



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

}
