/*--------------------[ MAIN ]------------------*/
.main{height:600px; position: relative; background:url(/images/earlytms/silk_line.svg) bottom center no-repeat #f6f6f6;
background-size:contain;}
h2{padding-bottom:15px; color:black;}
.main_center{position: absolute; top:50%; left:50%; transform: translate(-50%,-50%); text-align: center;}

/*--------------------[ SECTION_1 ]------------------*/
.section_bg {background: url(/images/earlytms/silk_line_2.svg) no-repeat bottom 50px center; background-size: contain; position: relative;}
.contents {display: flex; justify-content: space-between; padding-bottom: 100px;}
.contents .screen img {width:600px;  box-shadow: 0 5px 30px 0 rgba(0,0,0,0.3);}
.contents .screen1 img {width:600px;  box-shadow: 0 5px 30px 0 rgba(0,0,0,0.3); margin-top:-150px;}
.number_txt {color:#2975b0; font-size: 2em; padding-bottom: 10px; font-weight: bold;}
.txt_l .line {width:2px; height:50px; background: #1f496a;}
.txt_l div {text-align: left;}
.txt_r .line {width:2px; height:50px; background: #1f496a; position: absolute; top:40px; right:0px;}
.txt_r .number_txt {margin-bottom: 45px;}
.txt_r {text-align: right; position: relative;}
.box_bg {width:900px; height:400px; background: #eff1f3; margin-top:-40px; margin-left:-300px;}
.txt_r_wrap {display: flex; justify-content: flex-end; flex-direction: column;}
.txt_r_wrap .line {margin-left:670px;}
.contents .screen2 img{width:760px; margin-right:-160px;}
.txt_l_last {text-align: left; width:100%; padding-top:150px;}

/*--------------------[ SECTION_BTN ]------------------*/
.view_more_btn {position: absolute; left:50%; bottom:20%; transform: translateX(-50%); margin-bottom: 20px;}

/*--------------------[ SECTION_SLIIDER ]------------------*/
.slider-wrap{width:600px;height:300px;position:relative;overflow:hidden;box-shadow: 0 5px 30px 0 rgba(0,0,0,0.3);}
.slider-wrap ul#slider{position:absolute;top:0;left:0;}
.slider-wrap ul#slider li{float:left;position:relative;width:600px;height:300px;}
.slider-wrap ul#slider li i{text-align:center;line-height:400px;display:block;width:100%;font-size:90px;}

/*btns*/
.btns{position:absolute;width:50px;height:60px;top:50%;margin-top:-25px;line-height:57px;text-align:center;cursor:pointer;	background:rgba(0,0,0,0.1);z-index:100;
	-webkit-user-select: none;-moz-user-select: none;-khtml-user-select: none;-ms-user-select: none;
	-webkit-transition: all 0.1s ease;-moz-transition: all 0.1s ease;-o-transition: all 0.1s ease;-ms-transition: all 0.1s ease;transition: all 0.1s ease;}

.btns:hover{background:rgba(0,0,0,0.3);}

.next{right:-50px; border-radius:7px 0px 0px 7px;}
.previous{left:-50px; border-radius:0px 7px 7px 7px;}
.counter{top: 5px; right:10px; width:auto;position:absolute;color:#fff;}
.slider-wrap.active .next{right:0px;}
.slider-wrap.active .previous{left:0px;}

/*bar*/
.pagination-wrap{min-width:20px;margin-top:350px;margin-left: auto; margin-right: auto;height:15px;position:relative;text-align:center;}
.pagination-wrap ul {width:100%;}
.pagination-wrap ul li{margin: 0 4px;display: inline-block;width:5px;height:5px;border-radius:50%;background:#fff;opacity:0.5;position:relative;top:0;}
.pagination-wrap ul li.active{width:12px;height:12px;top:3px;opacity:1;box-shadow:rgba(0,0,0,0.1) 1px 1px 0px;}
.slider-wrap ul, .pagination-wrap ul li{-webkit-transition: all 0.3s cubic-bezier(1,.01,.32,1);-moz-transition: all 0.3s cubic-bezier(1,.01,.32,1);-o-transition: all 0.3s cubic-bezier(1,.01,.32,1);-ms-transition: all 0.3s cubic-bezier(1,.01,.32,1);transition: all 0.3s cubic-bezier(1,.01,.32,1);}

/*--------------------[ MEDIA QUERY ]------------------*/

@media only screen and (max-device-width : 667px) {
.section {padding-top:10px !important;}
    
/*[ MAIN ]*/
.main{height:400px; background-size:250%;}
.main_center{position: absolute; top:55%; left:50%; transform: translate(-50%,-50%); text-align: center; width:289px!important;}

/*[ SECTION_1_M ]*/
.section_bg {background: url(/images/earlytms/silk_line_2.svg) no-repeat bottom -10px center; background-size: 200%;}
.contents {display: block; justify-content:space-around; padding-bottom: 100px;}
.contents .screen img {width:100%; margin: 15px 0;}
.contents .screen1 img {width:100%; margin:15px 0;}
.number_txt {color:#2975b0; font-size: 2em; padding-bottom: 0px; font-weight: bold;}
.txt_l .line {visibility: hidden;}
.txt_l div {text-align: center; margin:-30px 0 10px 0;}
.txt_r .line {visibility: hidden;}
.txt_r div {text-align: center;}
.box_bg {width:100%; height:250px; background: #eff1f3; margin-top:0px; margin-left:0px;}
.txt_r_wrap {display: flex; justify-content: flex-end; flex-direction: column;}
.txt_r_wrap .line {visibility: hidden;}
.contents .screen2 img{width:120%; margin-left:-80px;}
.txt_l_last {text-align: center; width:100%; padding-top:0px;}
.contents .screen2 img{width:130%; margin-right:-80px;}

/*[ SECTION_BTN ]*/
.view_more_btn {position: absolute; left:50%; bottom:20%; transform: translateX(-50%); margin-bottom: 20px;}   
}