section {position:relative; padding:5rem 0;}
section:after {content:''; display:block; width:100%; clear:both;}

@media screen and ( max-width:1200px ) {
  section { padding:3.75rem 0 !important;}

}

@media screen and ( max-width:1024px ) {
  section { padding:2.5rem 0 !important;}
}
.main .title_wrap {margin-bottom:1.5rem; }
.title_wrap {position:relative; margin-bottom:2.5rem; }
.title_wrap h2 {font-size:1.55rem; line-height:1.3em; font-weight:600; color:var(--color-black); }
.title_wrap.flex {display:flex;  justify-content: space-between; align-items: flex-end; }
.title_wrap p {font-size:1.05rem; line-height:1.3em; font-weight:300; color:#616267;margin-top:.5rem;}
.main .title_wrap h2 {font-size:1.5rem;  }
.main .title_wrap p {font-size:1.25rem; }
.title_wrap.center {text-align:center;}
.title_wrap .more {font-size:.9rem; color:#555; margin-right:.5rem; letter-spacing:0}
.title_wrap .more:after {content:''; display:inline-block; vertical-align:middle;margin-left:0; width:.85rem; height:.7rem; background-repeat:no-repeat; background-position:center ; background-size:auto 100%;
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 50 50' style='enable-background:new 0 0 50 50;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23555555;%7D%0A%3C/style%3E%3Cg%3E%3Crect x='22' y='-0.5' transform='matrix(0.7072 -0.707 0.707 0.7072 -3.6031 22.1993)' class='st0' width='6' height='31.8'/%3E%3Crect x='9.1' y='31.6' transform='matrix(0.7071 -0.7071 0.7071 0.7071 -17.1087 27.7971)' class='st0' width='31.8' height='6'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.btn_wrap.end {display:block; position:relative;padding-right:1rem; padding-top:1rem; text-align:right;}
.btn_wrap.end .more{display:inline-block; font-size:.9rem; color:var(--color-blue); text-decoration:underline; letter-spacing:0; cursor:pointer; }
.btn_wrap { text-align:center; padding-top:.5rem}
.btn_wrap a {display:inline-flex;  justify-content: center; align-items: center; color:#333;   font-size:.9rem; }
.btn_wrap a.more2 {background-color:#f7f7f7; color:#333; border:1px solid #ddd; font-size:.9rem; height:2rem; padding:0 1.5rem; border-radius:1.5rem;}
.btn_wrap a.more2:hover {background-color:#222; border:1px solid #222; color:#fff;}
.btn_wrap.type2 {padding-top:1.5rem; padding-bottom:1rem;}
.btn_wrap.type2 a,
.btn_wrap.type2 button{display:inline-flex;  justify-content: center; align-items: center; background-color:#fff; color:#333; border:1px solid #ddd; font-size:.95rem; height:2.85rem; padding:0 1.5rem; border-radius:.25rem;}
.btn_wrap.type2 a:before,
.btn_wrap.type2 button:before{content:''; display:inline-flex; align-items: center;margin-right:.3rem; font-family:'xeicon'; font-size:1rem;}
.btn_wrap.type2 .list:before {content:"\e91c"}
.btn_wrap.type2 .reset:before {content:"\e973"}
.btn_wrap.type2 .inquiry {background-color:var(--color-black); border-color:var(--color-black);  color:#fff; }
.btn_wrap.type2 .inquiry:before {content:"\ea07"}




@media screen and ( max-width:1024px ) {
	.title_wrap {margin-bottom:1.5rem;}
	.title_wrap h2 {font-size:1.15rem;  }
	.title_wrap p {font-size:.9rem;}
	.main .title_wrap h2 {font-size:1.15rem;  }
	.main .title_wrap p {font-size:.9rem;}
	.title_wrap h2 {font-size:1.25rem; }
    .title_wrap p {font-size:.85rem; margin-top:.25rem;}

	.title_wrap .more {font-size:.75rem; line-height:1.3em; margin-right:0;}
	.title_wrap .more:after { width:1.1rem; height:.5rem;}

	.btn_wrap.type2 a,
	.btn_wrap.type2 button{font-size:.9rem; height:2.5rem; padding:0 .85rem; }
	.btn_wrap.type2 a:before,
    .btn_wrap.type2 button:before{display:none;}
}



/* 메인팝업레이어*/
	.layer_popup {}
	.layer_popup:before {display:block; content:""; position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0); z-index:33333; transition: all 0.2s ease-in; display:none;}
	.layer_popup .layerBox {position:fixed; left:50%; top:50%; transform: translate(-50%,-50%); max-width:500px; background-color:#111; border-radius:4px; overflow:hidden;box-shadow:8px 8px 20px -5px rgba(0,0,0,0.5); z-index:99999;transition: all 0.2s ease-in;}
	.layer_popup .layerBox .imgbox { display:block; }
	.layer_popup .layerBox img {
	  max-width: 100%;
	  height: auto;
	  display: block;
	}
	/*.layer_popup .layerBox img {width:auto;}*/
	.layer_popup .layerBox .pop_foot {display:flex; width:100%;background-color:#fff; height:45px; font-size:0; }
	.layer_popup .layerBox input[type=checkbox] + label {color:#333;  background-color:#f9f9f9;  padding:0; text-align:center; font-size:14px;  line-height:45px; width:calc(100% - 120px); font-family:Sans-serif;}
	.layer_popup .layerBox input[type=checkbox] + label:before {display:none;}
	.layer_popup .close_pop {  width:120px; border-left:1px solid rgba(255,255,255,0.18);background-color:#333; color:#fff;font-size:14px;  line-height:45px; text-align:center;font-family:Sans-serif;  }
 
@media screen and (max-width:790px){ 
.layer_popup .layerBox {left:0%; margin-left:0px; top:50% !important; left:50% !important; width:90%; max-width:90%; transform: translate(-50%,-50%) !important; }
.layer_popup .layerBox img {width:100%;}
.layer_popup .layerBox .pop_foot { height:35px;}
.layer_popup .layerBox input[type=checkbox] + label { font-size:13px;  line-height:35px; width:calc(100% - 100px); }
.layer_popup .close_pop { font-size:13px; width:100px;  line-height:35px;  }
}

/* swiper */
.main-visual { position: relative;   height:450px; width:100%; overflow: hidden; }
.main-visual .swiper-slide { width: 100%; position: relative;  display: flex; align-items: center; }

.swiper-android .swiper-slide, .swiper-wrapper { transform: translate3d(0px,0,0);}
.swiper-wrapper {position: relative; width: 100%; height:100%;   z-index: 1; display: flex; transition-property: transform; box-sizing: content-box; /*transition-timing-function: linear;*/}
.swiper-slide { flex-shrink: 0; width: 100%;  height:100%;  text-align:center; position: relative; transition-property: transform; background-repeat:no-repeat; background-position:center center; background-size:cover; }
.swiper-slide.n01 { background-image:url('/images/main/visual01.jpg'); }
.swiper-slide.n02 { background-image:url('/images/main/visual02.jpg'); }
.swiper-container-fade .swiper-slide{pointer-events:none;transition-property:opacity;}
.swiper-container-fade .swiper-slide-active,
.swiper-container-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto;}


.visual-copy {position: relative; width: 1200px; padding:0 1rem; margin:-2rem auto 0; text-align: left; display:flex; justify-content: center;  flex-direction: column;  z-index: 10;  }
.visual-copy .copy1,
.visual-copy .exp {transition:all 1.0s cubic-bezier(0.165, 0.84, 0.44, 1);opacity: 0;font-family: 'Roboto'; }

.visual-copy .copy1 {transform: translateY(20px); transition-delay: .4s; }
.visual-copy .exp {transform: translateY(20px); transition-delay: .2s; }
.visual-copy strong {font-weight:700 !important; }


.visual-copy .copy1 { display:block; color:#fff; font-size:3rem; line-height:3.5rem;margin-top:.5rem; font-weight:600;  }
.visual-copy .exp { display:block; color:#fff; font-size:1.125rem; line-height:1.5em; font-weight:300;  }
.visual-copy strong {font-weight:700;}

.swiper-slide.n02 .copy1,
.swiper-slide.n02 .exp {color:#fff;}

.main-visual .swiper-slide.swiper-slide-active .visual-copy .copy1 {transform: translateY(0px); opacity:1;}
.main-visual .swiper-slide.swiper-slide-active .visual-copy .exp{transform: translateY(0px); opacity:1;}

.visual-swiper-control {  position: absolute;  left: 50%;  margin-left: -570px;  bottom: 2.5rem;  color: #fff;  display: flex;  align-items: center;  z-index: 100; }
.visual-progressbar {  width: 80px;  height: 3px;  position: relative;  background-color: rgba(255, 255, 255, 0.5);  transition: .3s opacity;  text-align: center;  position: relative;  overflow: hidden;  margin: 0 14px;}
.visual-progressbar .bar {  display: block;  content: '';  background-color:#fff;  position: absolute;  left: 0;  top: 0;  width: 0;  height: 100%;}
.visual-progressbar.play .bar {  animation: barMotion 5s forwards linear;}

.visual-swiper-paging.swiper-pagination-progressbar {  width: 80px;  height: 3px;  position: relative;  background-color: rgba(255, 255, 255, 0.3);  transition: .3s opacity;  text-align: center;  position: relative;  overflow: hidden;  margin: 0 0px;}
.visual-swiper-paging.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {  background-color: #fff;  position: absolute;  left: 0;  top: 0;  width: 100%;  height: 100%;  transform: scale(0);  transform-origin: left top;}
.visual-swiper-control .swiper-pagination { display: flex; align-items: center; margin-right: .65rem; font-size: 18px;  color: #fff;  font-weight: 700;}

.visual-swiper-control .swiper-pagination .current-page,
.visual-swiper-control .swiper-pagination .total-page {  width: 24px; font-size:.9rem; color:#fff; text-align: center; font-weight:400;}
.visual-swiper-control .swiper-pagination .current-page {color:#fff; font-weight:500;}

/* dot로 표시할때 */
.visual-swiper-control .swiper-pagination-bullet {  width: 3.5rem;  height: 4px;  background: #FFF; margin-right:.5rem;  opacity: 0.7;  transition: background 0.3s;}
.visual-swiper-control .swiper-pagination-bullet-active {  background: var(--color-main);  opacity: 1;}

.visual-swiper-control .btn-swiper-prev,
.visual-swiper-control .btn-swiper-next,
.visual-swiper-control .btn-swiper-stop {  width: 20px;  height: 20px;  text-align: left; font-size:0; overflow: hidden;  margin: -3px 5px 0; background-color:transparent; border:0px solid #fff; outline:0;cursor:pointer; }

.visual-swiper-control button:before {content:""; display:inline-block; vertical-align:top; font-size:1rem; color:#333; font-family:'xeicon';}
.visual-swiper-control .btn-swiper-prev:before {content:"\e93b";}
.visual-swiper-control .btn-swiper-next:before {content:"\e93e";}

.visual-swiper-control .btn-swiper-stop {position:absolute; left:160px;}
.visual-swiper-control .btn-swiper-stop::after { content: "\ea3b"; font-size:1.25rem;line-height:20px; color:#fff; font-family:'xeicon';/* 일시정지 아이콘 */}
.visual-swiper-control .btn-swiper-stop.on::after { content:"\ea3e"; color:#fff; /* 재생 아이콘 */}

@keyframes barMotion {
  0% { width: 0; }
  100% { width: 100%; }
}

@keyframes ani_ico {
    0% {
    	transform:translateY(0px);
    	-webkit-transform:translateY(0px);
    	-ms-transform:translateY(0px);
    	-moz-transform:translateY(0px);
    }
    50% {
    	transform:translateY(-15px);
    	-webkit-transform:translateY(-15px);
    	-ms-transform:translateY(-15px);
    	-moz-transform:translateY(-15px);
    }
}
@media screen and ( max-width:1200px ) {
	.visual-copy {position: relative; width: 100%; }
	.visual-swiper-control {margin:0; left:1rem; width:100%;}
	
}
@media screen and ( max-width:900px ) {
	.main-visual {height:300px;}
    .visual-copy {margin-top:-3rem !important; }
	.visual-copy .copy1 { font-size:1.5rem; line-height:1.5em; }
	.visual-copy .exp { font-size:1.05rem; line-height:1.5em; font-weight:400; }

}
@media screen and ( max-width:640px ) {
    .main-visual {height:250px;}
	.visual-swiper-control .swiper-pagination .current-page,
	.visual-swiper-control .swiper-pagination .total-page { font-size:.85rem; }
	.visual-swiper-control .btn-swiper-stop {position:absolute; left:155px;}
	.visual-swiper-control .btn-swiper-stop::after { font-size:1rem; }
	
}

/* main search */
.main_search {position:relative; clear:both; width:100%; z-index:33; background-color:#f2f4f6; padding:3rem 0; border-top:1px solid transparent;}
.main_search .search_wrap { padding:2rem 2.5rem; background-color:#fff; border-radius:.85rem; box-shadow:.25rem .25rem 1rem rgba(0,0,0,0.1); display:flex; gap:6px; font-size:0; flex-wrap: wrap;}
.main_search .btn {width:calc(50% - 4px); height:2.65rem; margin:0; display:flex; align-items: center; border-radius:0; padding:0 1rem; border: 1px solid #ebedf2; color:var(--color-sub);font-size:1rem; cursor: pointer; background: #f5f6f9; 
background-size:auto .75rem; text-transform:uppercase; background-repeat:no-repeat; background-position:calc(100% - .9rem) ; 
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Cursor_icons' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 50 37.5' style='enable-background:new 0 0 50 37.5;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23A6A8AB;%7D%0A%3C/style%3E%3Cpath class='st0' d='M32.6,1.7c-0.8-0.8-2.1-0.8-2.9,0c-0.8,0.8-0.8,2.1,0,2.9l12.1,12.1H3.3c-1.1,0-2.1,0.9-2.1,2.1 s0.9,2.1,2.1,2.1h38.5L29.7,32.9c-0.8,0.8-0.8,2.1,0,2.9c0.4,0.4,0.9,0.6,1.5,0.6c0.5,0,1.1-0.2,1.5-0.6l15.6-15.6 c0.8-0.8,0.8-2.1,0-2.9L32.6,1.7z'/%3E%3C/svg%3E%0A");
}

.main_search .btn.result { background-color:#162a41; border-color:#162a41;color:#fff;  justify-content: center;text-transform:capitalize;
background-image:none;
}
.main_search .btn.result:after {content:''; display:inline-flex; margin-left:.5rem; width:1.5rem; height:1rem; background-repeat:no-repeat; background-position:center center; background-size:auto .75rem; 
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Cursor_icons' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 50 37.5' style='enable-background:new 0 0 50 37.5;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23FFFFFF;%7D%0A%3C/style%3E%3Cpath class='st0' d='M32.6,1.7c-0.8-0.8-2.1-0.8-2.9,0c-0.8,0.8-0.8,2.1,0,2.9l12.1,12.1H3.3c-1.1,0-2.1,0.9-2.1,2.1 s0.9,2.1,2.1,2.1h38.5L29.7,32.9c-0.8,0.8-0.8,2.1,0,2.9c0.4,0.4,0.9,0.6,1.5,0.6c0.5,0,1.1-0.2,1.5-0.6l15.6-15.6 c0.8-0.8,0.8-2.1,0-2.9L32.6,1.7z'/%3E%3C/svg%3E%0A");
}
.main_search .btn.result b {color:var(--color-main);margin-right:.2rem; font-weight:700;}
.dropdown { position: relative; display:inline-flex;width: calc(25% - 5px); }
.dropdown-toggle {width: 100%;  height:2.65rem; display:flex; align-items: center; padding:0 1rem; border: 1px solid #ebedf2; font-size:1rem; cursor: pointer; background: #f5f6f9 url('/images/arrow_down.svg') no-repeat 95% ; background-size:auto .75rem; text-transform:uppercase; }
.dropdown-toggle.selected {color:var(--color-dark-blue); font-weight:600;}
.dropdown-menu { position: absolute; top: 100%; left: 0; width: 100%; border: 1px solid #ebedf2;border-top:0; background:#fff; max-height: 250px; overflow-y: auto; display: none; z-index: 10; }
.dropdown.show .dropdown-menu { display: block; }
.dropdown-search {padding: 10px;border-bottom: 1px solid #ddd;}
.dropdown-search input {width: 100%; padding: 8px;border: 1px solid #aaa; color:var(--color-sub)}
.dropdown-search input:focus {border-color:var(--color-sub)}
.dropdown-option {padding: 10px;cursor: pointer; color:#868d99; font-size:.9rem; }
.dropdown-option:hover {background-color: #eef1f8; color:var(--color-sub) }
.dropdown-search input::placeholder {font-size:.85rem;}

.search_make {padding-top:2.5rem;}
.search_make ul {position:relative; display:flex;  flex-wrap: wrap; gap:1.5rem 0; height:225px; overflow:hidden;}
.search_make ul.expanded {height:auto !important;overflow:visible}
.search_make ul li {width:12.5%; display:flex; justify-content: center;}
.search_make ul li a {width:80%;height:100px; border-radius:.5rem; background-color:#fff; border:1px solid #d9dde4; display:flex;  justify-content: center; align-items: center;flex-direction: column;}
.search_make ul li a:hover {border-color:var(--color-sub); box-shadow:5px 5px 15px rgba(0,0,0,0.1)}
.search_make ul li a img {height:2.2rem;}
.search_make ul li a p {font-size:.8rem; color:#717274; text-align:center; }

@media screen and ( max-width:1200px ) {
  .search_make ul li a {width:90%;height:90px;}
}

@media screen and ( max-width:1024px ) {
  .main_search {padding:0 0 3rem}
  .main_search .search_wrap {padding:1.2rem 1rem; border-radius:.5rem;} 
  .dropdown { width: calc(50% - 4px); }
  .dropdown-toggle,
  .main_search .btn {font-size:.9rem; padding:0 .5rem;}
  .dropdown-toggle {background-size:auto .65rem; }
  .main_search .btn {background-position:calc(100% - .5rem); background-size:auto .65rem;}
  .main_search .btn.result:after { background-size:auto .65rem; }

  .search_make ul {gap:.65rem 0; height:190px; margin-left:-.35rem; margin-right:-.35rem;}
  .search_make ul li {width:25%;}
  .search_make ul li a {width:100%;height:auto;border-radius:0; background-color:transparent; border:0;  }
  .search_make ul li a:hover { box-shadow:none}

}
@media screen and ( max-width:500px ) {
	.main_search .btn {width:100%;}
	.search_make ul {  height:185px; }
	.search_make ul li a p {font-size:.75rem;}
}

@media screen and ( max-width:360px ) {
	 .dropdown {width:100%;}
	 .main_search .btn {background-position:calc(100% - 1rem); }
}




/* 차량검색 메인 */
.main .search_area { position:relative;width:100%; background-color:#f4f7fc; padding:2.5rem 0;}
.main .search_area .column {width:1200px;margin:0 auto;}
.main .search_area .box_top {display:flex; justify-content: space-between;align-items: center; padding-bottom:.5rem;}
.main .search_area .wrap { position:relative;background-color:#fff; margin-top:.5rem; padding:1.5rem 2rem .65rem; border-radius:.65rem; box-shadow:.1rem .1rem .65rem rgba(0,0,0,0.08)}
.main .search_area .in_wrap {position:relative;}
.main .search_area .box_top h2 { display:block;font-size:1.125rem; color:var(--color-sub)}
.main .search_area .box_top .word_search {position:relative; width:320px; border-radius:5rem; border:1px solid #dbdee2; padding:4px; display:flex; align-items: center;justify-content: space-between;}
.main .search_area .box_top .word_search .input_wrap {position:relative;width:calc(100% - 70px); }
.main .search_area .box_top .word_search input[type="text"] {width:100%; height: 31px;border:0; background-color:#fff;padding-left:1rem; border-radius:5rem; font-size:.95rem; color:#111; outline:0;font-weight:500 }
.main .search_area .box_top .word_search input[type="text"]:focus {box-shadow:none; }
.main .search_area .box_top .word_search input:-webkit-autofill { -webkit-text-fill-color: #333; } 
.main .search_area .box_top .word_search input::placeholder {color:#aaa; font-size:.8rem; font-weight:400;}
.main .search_area .box_top .word_search .btn_search { width:70px;display:inline-flex; align-items: center;  justify-content: center;height:31px;font-size:.8rem; border-radius:5rem; color:#fff;background-color:#313850; line-height:1;  cursor:pointer; }
.main .search_area .btnClear { position: absolute;  top:0;  right: .2rem; width: 30px;height: 31px; display:none; border:0; outline:0; background:transparent; cursor:pointer; }
.main .search_area .btnClear:before {content:"\e921";font-family:'xeicon'; color:#333; font-size:1rem; height: inherit; display:flex; justify-content: center;align-items: center;}



/* body type */
.main .search_area .body_type {display:flex;font-size:0; justify-content: center;  justify-content: space-around; padding-bottom:.5rem;}
.main .search_area .body_type li {width:10%; padding: .2rem 0;  text-align:center;display:inline-flex; align-items: center;  gap:0;  cursor:pointer; flex-direction: column; transition: all 0.2s ease-in;}
.main .search_area .body_type li.active span {color:var(--color-blue) !important;}
.main .search_area .body_type li figure { width:100%; height:48px; background-repeat:no-repeat; background-position:center center; background-size:auto 90%; transition: all 0.1s ease-in; }
.main .search_area .body_type li img { height:40px; }
.main .search_area .body_type li span {font-size:1rem; line-height:1.3em; margin-top:.5rem;font-weight:500; color:#333;  }
.main .search_area .body_type li:hover span {color:var(--color-blue); }
.main .search_area .body_type li.active span {color:var(--color-blue); }
.main .search_area .body_type li:hover figure {background-size:auto 100%;}
.main .search_area .body_type li.active figure {background-size:auto 100%;}
.main .search_area .body_type li.n00 figure { background-image:url("/images/class_all.png"); }
.main .search_area .body_type li.n01 figure { background-image:url("/images/class_01.png"); }
.main .search_area .body_type li.n02 figure { background-image:url("/images/class_02.png");  }
.main .search_area .body_type li.n03 figure { background-image:url("/images/class_03.png");  }
.main .search_area .body_type li.n04 figure { background-image:url("/images/class_04.png"); }
.main .search_area .body_type li.n05 figure { background-image:url("/images/class_05.png");  }


@media screen and (max-width: 1200px) {
  .main .search_area .column { width:100%; }
}

@media screen and (max-width: 670px) {
    .main .search_area {padding:2rem 0;}
	/* body type */
	.main .search_area .body_type li figure { height:40px; }
	.main .search_area .body_type {flex-wrap: wrap;  }
	.main .search_area .body_type li {width:33.3%; }

}
@media screen and (max-width: 380px) {
	.main .search_area .body_type li figure { height:31px; }
	.main .search_area .body_type li span { font-size:.75rem; margin-top:0 }
}


.main .search_area .selectBox {position: relative; width:100%; font-size:0;}
.main .search_area .selectBox .row {display:flex; align-items: center;  gap:5px; flex-wrap: wrap;}
.main .search_area .selectBox .row.r2 { position: relative; gap:0 5px;}
.main .search_area .selectBox .row.r2 .subline {position:relative; margin:.5rem 0; height:1px; width:100%; background-color:#f4f4f4; }
.main .search_area .selectBox div.step { position: relative; width:calc(20% - 5px);margin-bottom:5px; }
.main .search_area .selectBox .step a.link{ display:block; position: relative; width:100%; color:#1b1b1b;border-radius:5px;height:45px;  line-height:43px; font-size:.85rem; text-align:left;word-break:break-all; 
padding:0 1.25rem 0 .85rem; border:1px solid #e6e6e6; background:#f7f7f7; overflow:hidden; word-break:keep-all; white-space:nowrap; text-overflow:ellipsis; text-transform: capitalize;
background-size:auto .65rem; background-position:calc(100% - 8px);background-repeat:no-repeat;
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 21 17' style='enable-background:new 0 0 21 17;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23777777;%7D%0A%3C/style%3E%3Cg%3E%3Crect x='1' y='7.5' transform='matrix(-0.7071 -0.7071 0.7071 -0.7071 5.8611 19.4217)' class='st0' width='12' height='2'/%3E%3Crect x='8' y='7.5' transform='matrix(-0.7071 0.7071 -0.7071 -0.7071 29.9924 4.5828)' class='st0' width='12' height='2'/%3E%3C/g%3E%3C/svg%3E%0A");
}

.main .search_area .selectBox .step a.link.selected {color:var(--color-blue); font-weight:500;}
.main .search_area .selectBox .step a.link.active{/*border-color:var(--color-sub); box-shadow:4px 4px 10px rgba(45,68,128,0.1);*/; position: relative;  z-index:334; overflow:visible;}
.main .search_area .selectBox .step a.link.active:after {content:''; border:1px solid #000; border-bottom:0; position:absolute; left:0; right:0; top:-1px; bottom:-4px; border-radius:5px 5px 0 0;background-color:#fff;z-index:-1 ; overflow:hidden;}
.main .search_area .selectBox .step a.link span {display:inline-block; vertical-align:middle; overflow: hidden;  text-overflow: ellipsis;  white-space: nowrap;  max-width: 100%; border:1px solid #f00}
.main .search_area .selectBox .step a.link.active span {display:inline-block; vertical-align:middle; overflow: hidden;  text-overflow: ellipsis;  white-space: nowrap;  max-width: 100%; border:1px solid #f00}
.main .search_area  .optionBox_wrap {display:none; position:absolute;top:47px;left:0;/*bottom:0; right:0;background:rgba(0,0,0,0.2);*/ z-index:333;  }

.main .search_area .optionBox { position: relative; width:320px; padding:0 .65rem 1rem; border-radius:0; background:#fff; text-align:left;box-shadow:4px 4px 10px rgba(45,68,128,0.1); margin-left:1px; border:1px solid #000; z-index:1;
                                  box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box; font-size:0;}
.main .search_area .optionBox h4 { position:relative;height:2.5rem; line-height:2.5rem;padding-left:.1rem; font-size:.9rem; color::#222;font-weight:500; margin:0;}
.main .search_area .optionBox h4.line {border-bottom:1px solid #f5f5f5; margin-bottom:.5rem;}
.main .search_area .optionBox h4 button { position:absolute;top:0;right:-.65rem;font-size:0;width:40px;height:40px;background:url('/images/main/pop_close.png') no-repeat center center;background-size:auto 15px;}
.main .search_area .optionBox h5 {padding:0px 0 .35rem;font-size:0.95rem; line-height:1rem; color:#555;font-weight:600;}
.main .search_area .optionBox > div {  display: flex;  flex-wrap: wrap;  gap: .4rem; font-size: 0; }
.main .search_area .optionBox a { position:relative;display: inline-block; vertical-align:top;  width: calc(25% - .4rem);  font-size: .8rem;line-height:1; padding: 7px .5rem 7px 1.85rem;  border-radius: 2px;  text-transform: capitalize;  color: #1b1b1b;}
.main .search_area .optionBox a:before {content:"\e929";position:absolute; left:0px; top:4px;padding-top:2px; color:#f1f1f1; border:1px solid #eee;  text-align:center; display:inline-flex; justify-content: center; align-items: center;width:20px; height:20px;font-size:1.35rem;}
.main .search_area .optionBox a:hover:before {background-color:var(--color-blue); color:#fff;border-color:var(--color-blue)}
.main .search_area .optionBox a:hover {color:var(--color-blue)}
.main .search_area .optionBox a.active {  color: var(--color-blue); }
.main .search_area .optionBox a.active:before { color:#fff;  background-color:var(--color-blue);border-color:var(--color-blue)}
.main .search_area .optionBox_wrap.right {right:0 !important; left:auto !important;}
.main .search_area .optionBox_wrap.right .optionBox {margin-right:1px;}
.main .search_area .optionBox_wrap.center {left:50% !important;margin-left:-160px;}
.main .search_area .optionBox > div a {width: calc(50% - .4rem); }
.main .search_area .optionBox.round1 {width:930px;}
.main .search_area .optionBox.round1 > div {max-height:400px; overflow-y:auto;}
.main .search_area .optionBox.round1 a {width: calc(25% - .4rem); }
.main .search_area .optionBox.round2 {width:700px; }
.main .search_area .optionBox.round2 a {width: calc(25% - .4rem); }
.main .search_area .optionBox.round3 {width:500px; }
.main .search_area .optionBox.round3 a {width: calc(50% - .4rem); }
.main .search_area .optionBox.round4 {width:500px; }
.main .search_area .optionBox.round4 a {width: calc(25% - .4rem); }
.main .search_area .optionBox.option {width:916px; }
.main .search_area .optionBox.option > div  {max-height:400px; overflow-y:auto;}
.main .search_area .optionBox.option a {width: calc(25% - .4rem); }
.main .search_area .optionBox.color {width:600px; }
.main .search_area .optionBox.color a {width: calc(33.3% - .4rem); }
.main .search_area .optionBox.default {width:100%; }
.main .search_area .optionBox.default a {width: calc(100% - .4rem); }
.main .search_area .select_item {display:flex; width:100%; align-items: center;  justify-content: center; gap:.2rem; font-size:.85rem; padding:.2rem; }
.main .search_area .select_item select {height:35px; border-radius:4px; border:1px solid #e4e6e9; width:100%; font-size:.85rem; }

.main .search_area .result_box {position:relative;display:flex; justify-content: space-between; align-items:center; gap:5px;margin-top:.35rem; }
.main .search_area .result_box .filter { width:calc(100% - 12%); font-size:.9rem; min-height:1.75rem; color:#222; display:block;}
.main .search_area .result_box .filter span { margin:2px;}
.main .search_area .result_box .filter span:last-child {margin-right:0;}
.main .search_area .result_box .filter .item { cursor:pointer; font-size:.8rem; color:#333;  line-height:.9rem; padding:.25rem .85rem; display:inline-flex; align-items: center; border-radius:2rem; background-color:#f7f7f7;}
.main .search_area .result_box .filter .item:after {content:"\e921"; font-family:'xeicon'; font-weight:500; color:#555;margin-left:.25rem; font-size:.75rem; display:inline-flex;  align-items:center; line-height:inherit; }
.main .search_area .result_box .filter .clear {cursor:pointer; color:#111;}
.main .search_area .result_box .filter .clear:before {content:"\e973"; font-family:'xeicon'; transform: rotate( 180deg );font-size:.95rem; display:inline-flex;  align-items:center; margin-right:.1rem; line-height:inherit; }
.main .search_area .result_box .search_btn { width:12%;height:37px; line-height:37px;font-size:.95rem; border-radius:5px; color:#fff;border:0;padding:0;margin:0;  background-color:#313850;  }
.main .search_area .result_box .search_btn:before {content:''; display:inline-block; margin-right:.25rem; vertical-align:top; height:100%; width:1.5rem; background-repeat:no-repeat; background-position:center center; background-size:auto 45%; 
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 50 50' style='enable-background:new 0 0 50 50;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23FFFFFF;%7D%0A%3C/style%3E%3Cg%3E%3Cpath class='st0' d='M22.9,44.4c-11.7,0-21.3-9.5-21.3-21.3c0-11.7,9.5-21.3,21.3-21.3s21.3,9.5,21.3,21.3 C44.2,34.8,34.7,44.4,22.9,44.4z M22.9,6.3c-9.2,0-16.8,7.5-16.8,16.8c0,9.2,7.5,16.8,16.8,16.8s16.8-7.5,16.8-16.8 C39.7,13.8,32.2,6.3,22.9,6.3z'/%3E%3Cpath class='st0' d='M46.3,46.7c-0.6,0-1.2-0.2-1.6-0.7L37.8,39c-0.9-0.9-0.8-2.3,0-3.2s2.3-0.8,3.2,0l6.9,7.1 c0.9,0.9,0.8,2.3,0,3.2C47.4,46.5,46.8,46.7,46.3,46.7z'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.main .search_area .btn_box {position:absolute; right:5px; top:0; width:calc(20% - 5px) !important; height:45px; display:flex; gap:.35rem; align-items: center; }
.main .search_area .btn_box button {width:calc(100% - 45px); height:45px; border-radius:5px;display:flex; align-items: center;  justify-content: center;background-color:var(--color-blue); color:#fff; font-size:.95rem; font-weight:400; }
.main .search_area .btn_box button b {font-weight:600; margin-right:5px;font-size:1rem; }
.main .search_area .btn_box button:after {content:''; display:inline-block; vertical-align:top; margin-left:8px; width:25px; height:45px; background-size:auto 43%; background-repeat:no-repeat; background-position:center ;
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 50 50' style='enable-background:new 0 0 50 50;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23FFFFFF;%7D%0A%3C/style%3E%3Cg%3E%3Cpath class='st0' d='M22.9,44.4c-11.7,0-21.3-9.5-21.3-21.3c0-11.7,9.5-21.3,21.3-21.3s21.3,9.5,21.3,21.3 C44.2,34.8,34.7,44.4,22.9,44.4z M22.9,6.3c-9.2,0-16.8,7.5-16.8,16.8c0,9.2,7.5,16.8,16.8,16.8s16.8-7.5,16.8-16.8 C39.7,13.8,32.2,6.3,22.9,6.3z'/%3E%3Cpath class='st0' d='M46.3,46.7c-0.6,0-1.2-0.2-1.6-0.7L37.8,39c-0.9-0.9-0.8-2.3,0-3.2s2.3-0.8,3.2,0l6.9,7.1 c0.9,0.9,0.8,2.3,0,3.2C47.4,46.5,46.8,46.7,46.3,46.7z'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.main .search_area .btn_toggle { display:inline-flex;  font-size:.9rem; text-align:center; width:45px;height:100%; background-color:#e9f1f9; border-radius:5px; color:var(--color-sub); text-align:center; font-size:0; }
.main .search_area .btn_toggle:after {content:''; display:flex;  justify-content: center; align-items: center;width:100%; height:100%; vertical-align:middle; background-repeat:no-repeat; background-position:center ; background-size:auto 50%;
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 190 190' style='enable-background:new 0 0 190 190;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bclip-path:url(%23SVGID_00000162311857453280538830000009600519148580849043_);fill:%230265e1;%7D%0A%3C/style%3E%3Cg%3E%3Cdefs%3E%3Crect id='SVGID_1_' x='8.2' y='15.2' width='173.7' height='159.6'/%3E%3C/defs%3E%3CclipPath id='SVGID_00000072975729774348369600000017909394307955307670_'%3E%3Cuse xlink:href='%23SVGID_1_' style='overflow:visible;'/%3E%3C/clipPath%3E%3Cpath style='clip-path:url(%23SVGID_00000072975729774348369600000017909394307955307670_);fill:%230265e1;' d='M38.1,38.1V21 c0-3.2-2.6-5.9-5.9-5.9c-3.2,0-5.9,2.6-5.9,5.9v17C15.9,40.7,8.2,50.2,8.2,61.4c0,11.2,7.8,20.7,18.2,23.3V169 c0,3.2,2.6,5.9,5.9,5.9c3.2,0,5.9-2.6,5.9-5.9V84.8c10.4-2.6,18.2-12.1,18.2-23.3C56.3,50.2,48.5,40.7,38.1,38.1 M32.2,73.8 c-6.8,0-12.3-5.5-12.3-12.3c0-6.8,5.5-12.3,12.3-12.3s12.3,5.5,12.3,12.3C44.5,68.2,39,73.8,32.2,73.8'/%3E%3Cpath style='clip-path:url(%23SVGID_00000072975729774348369600000017909394307955307670_);fill:%230265e1;' d='M181.8,61.4 c0-11.2-7.8-20.7-18.2-23.3V21c0-3.2-2.6-5.9-5.9-5.9c-3.2,0-5.9,2.6-5.9,5.9v17c-10.4,2.6-18.2,12.1-18.2,23.3 c0,11.2,7.8,20.7,18.2,23.3V169c0,3.2,2.6,5.9,5.9,5.9c3.2,0,5.9-2.6,5.9-5.9V84.8C174.1,82.1,181.8,72.7,181.8,61.4 M157.8,73.8 c-6.8,0-12.3-5.5-12.3-12.3c0-6.8,5.5-12.3,12.3-12.3c6.8,0,12.3,5.5,12.3,12.3C170.1,68.2,164.6,73.8,157.8,73.8'/%3E%3Cpath style='clip-path:url(%23SVGID_00000072975729774348369600000017909394307955307670_);fill:%230265e1;' d='M100.9,105.2V21 c0-3.2-2.6-5.9-5.9-5.9c-3.2,0-5.9,2.6-5.9,5.9v84.2c-10.4,2.6-18.2,12.1-18.2,23.3c0,11.2,7.8,20.7,18.2,23.3v17 c0,3.2,2.6,5.9,5.9,5.9c3.2,0,5.9-2.6,5.9-5.9v-17c10.4-2.6,18.2-12.1,18.2-23.3C119.1,117.3,111.3,107.9,100.9,105.2 M95,140.9 c-6.8,0-12.3-5.5-12.3-12.3c0-6.8,5.5-12.3,12.3-12.3c6.8,0,12.3,5.5,12.3,12.3C107.3,135.4,101.8,140.9,95,140.9'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.main .search_area .btn_toggle.active:after { background-size:auto 42%;
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 190 190' style='enable-background:new 0 0 190 190;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%230265e1;%7D%0A%3C/style%3E%3Cg%3E%3Crect x='-3.8' y='87.9' transform='matrix(0.7071 -0.7071 0.7071 0.7071 -39.3503 95)' class='st0' width='197.5' height='14.1'/%3E%3Crect x='-3.8' y='87.9' transform='matrix(-0.7071 -0.7071 0.7071 -0.7071 95 229.3503)' class='st0' width='197.5' height='14.1'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.main .search_area .fuc_filter a { position:absolute; right:0; top:.35rem; display:inline-block;font-size:.85rem; text-decoration:underline; color:var(--color-main)}

.main .search_area ::-webkit-scrollbar { background: transparent;width: 4px;height:4px; }
.main .search_area ::-webkit-scrollbar-track { background: #fff; }
.main .search_area ::-webkit-scrollbar-thumb { background:#999; opacity:1 !important;   }



@media screen and (max-width: 1200px) {
  .main .search_area {width:100%;}
}

.fuc_view {display:none;}


@media screen and (max-width: 900px) {
    .main .search_area .wrap {padding:0; background-color:transparent; box-shadow:none;}
	.main .search_area .box_top .word_search {width:100%;}
	.main .search_area .selectBox div.step {width:100% !important;}
	.main .search_area .selectBox .row {  gap:0px;  }
	.main .search_area .selectBox .row.r2 .subline {display:none !important;}
	.main .search_area .selectBox .step a.link {background-color:#fff;}
	.main .search_area .selectBox .step a.link.active{  z-index:1;  }
	.main .search_area .selectBox .step a.link.active:after {display:none !important; }
	.main .search_area .optionBox {border:0; margin:0;}
	.main .search_area .optionBox_wrap {display:none; position:fixed;top:0;left:0;bottom:0; right:0;background:rgba(0,0,0,0.2); z-index:333;  }
	.main .search_area .optionBox_wrap.right {right:0 !important; left:0 !important;}
	.main .search_area .optionBox_wrap.center {left:0 !important;margin:0;}
	.main .search_area .optionBox > div {max-height:300px !important;min-height:80px; overflow-y:auto; align-items: flex-start; }
	.main .search_area .optionBox {position:absolute; bottom:0; left:0; right:0; width:100%; max-height:80%; overflow-y:auto; padding:1rem;  background:#fff; text-align:left;box-shadow:none; border-radius: 12px 12px 0 0; transition: bottom 0.3s ease-in; }
	.main .search_area .optionBox.round1 {width:100%;}
	.main .search_area .optionBox.round1 a {width: 100% }
	.main .search_area .optionBox.round2 {width:100%; }
	.main .search_area .optionBox.round2 a {width: 100% }
	.main .search_area .optionBox.round3 {width:100%; }
	.main .search_area .optionBox.round3 a {width: 100% }
	.main .search_area .optionBox.round4 {width:100%; }
	.main .search_area .optionBox.round4 a {width: 100% }
	.main .search_area .optionBox.option {width:100%; }
	.main .search_area .optionBox.option a {width: 100% }
	.main .search_area .optionBox.color {width:100%; }
	.main .search_area .optionBox.color a {width: 100% }
	.main .search_area .optionBox.default {width:100%; }
	.main .search_area .optionBox.default a {width: 100% }

	.main .optionBox_wrap.active .optionBox {  bottom: 0; }
	.main .search_area .btn_box {position:relative; right:auto; top:auto; width:100% !important;}
	.main .search_area .btn_toggle {background-color:#fff; border:1px solid var(--color-blue)}
	.main .search_area .result_box {flex-direction: column; }
	.main .search_area .result_box .filter {width:100%}
	.main .search_area .result_box .filter .ntxt {display:none;}
	.main .search_area .result_box .search_btn {width:100%; font-size:.9rem; color:#fff;}
	.main .search_area .result_box .filter .item {background-color:#fff; }
}

.main .search_area.basic {display:flex; gap:5px; }
.main .search_area.basic .calendar,
.main .search_area.basic select {width:20%; border-color:#b2b6bd}
.main .search_area.basic input[type="date"] {width:20%;border-color:#b2b6bd; padding:0 .5rem 0 .65rem; border-radius:5px; border:1px solid #b2b6bd}
.main .search_area.basic input[type="text"] {width:calc(40% - 135px);border-color:#b2b6bd}
.main .search_area.basic .search_btn {width:120px; background-color:var(--color-sub); color:#fff; display:inline-flex;align-items: center; justify-content: center; border-radius:5px;}
.main .search_area.basic .search_btn:before {content:''; display:inline-block; margin-right:.25rem; vertical-align:top; height:100%; width:1.5rem; background-repeat:no-repeat; background-position:center center; background-size:auto 45%; 
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 50 50' style='enable-background:new 0 0 50 50;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23FFFFFF;%7D%0A%3C/style%3E%3Cg%3E%3Cpath class='st0' d='M22.9,44.4c-11.7,0-21.3-9.5-21.3-21.3c0-11.7,9.5-21.3,21.3-21.3s21.3,9.5,21.3,21.3 C44.2,34.8,34.7,44.4,22.9,44.4z M22.9,6.3c-9.2,0-16.8,7.5-16.8,16.8c0,9.2,7.5,16.8,16.8,16.8s16.8-7.5,16.8-16.8 C39.7,13.8,32.2,6.3,22.9,6.3z'/%3E%3Cpath class='st0' d='M46.3,46.7c-0.6,0-1.2-0.2-1.6-0.7L37.8,39c-0.9-0.9-0.8-2.3,0-3.2s2.3-0.8,3.2,0l6.9,7.1 c0.9,0.9,0.8,2.3,0,3.2C47.4,46.5,46.8,46.7,46.3,46.7z'/%3E%3C/g%3E%3C/svg%3E%0A");
}

@media screen and (max-width: 670px) {
	.main .search_area.basic {flex-direction:column; }
	.main .search_area.basic .calendar,
	.main .search_area.basic input[type="date"],
	.main .search_area.basic select,
	.main .search_area.basic input[type="text"],
	.main .search_area.basic .search_btn{width:100%; height:2.5rem; font-size:.9rem;}
	.main .search_area .select_item {padding:.5rem 0;}

}


/* how to buy */
.howtobuy { background-color:#0c1d39; border:0; padding-bottom:7rem;}
.howtobuy.sub {  border:5px solid #f2f4f6; padding:2.5rem 0;}
.howtobuy .title_wrap {text-align:center; margin-bottom:2rem;}
.howtobuy .title_wrap h2 {font-size:1.85rem; color:#fff;}
.howtobuy .title_wrap p {font-size:1.1em; font-weight:300;color:#fff; margin-top:.25rem;}
.howtobuy ul {font-size:0; }
.howtobuy ul li {display:inline-block; vertical-align:top;width:calc(33.3% - 1.25rem); margin-left:1.875rem;  background-color:#fff; border-radius:.65rem; overflow:hidden; }
.howtobuy ul li:nth-child(1) {margin-left:0;}
.howtobuy ul li:nth-child(1),
.howtobuy ul li:nth-child(3) {margin-top:2rem}
.howtobuy ul li figure img{ width:100%;}
.howtobuy ul li .txt_box {padding:1.25rem 1rem; text-align:center; }
.howtobuy ul li .txt_box h3 {font-size:1.25rem; font-weight:500; color:var(--color-black); line-height:1.3em;}
.howtobuy ul li .txt_box h3 span {display:block; font-size:1rem; color:var(--color-blue); font-weight:600; text-transform:uppercase; }
.howtobuy ul li .txt_box p {font-size:.95rem; color:#555; line-height:1.3em; margin-top:.5rem; }

@media screen and ( max-width:1024px ) {
	.howtobuy ul li { width:calc(33.3% - .5rem); margin-left:.75rem; }
	.howtobuy ul li:nth-child(1),
	.howtobuy ul li:nth-child(3) {margin-top:0rem}
	.howtobuy ul li .txt_box {padding:1rem .25rem; }
	.howtobuy ul li .txt_box p br {display:none;}
	.howtobuy .title_wrap h2 {font-size:1.35rem;  }
    .howtobuy .title_wrap p {font-size:1em; }
}

@media screen and ( max-width:640px ) {
	.howtobuy ul li { display:block; width:100%; margin-left:0; margin-bottom:.85rem; }
}


/* review */
.main .reviews {background-color:#f7f9fc; margin:0;}
.main .reviews ul {font-size:0;}
.main .reviews ul li {display:inline-block; vertical-align:top;  margin:0 .6rem; width:31.5%; overflow:hidden; }
.main .reviews ul li .txt_box {padding:1rem .25rem 0; display:flex; flex-direction: column; gap:.5rem; }
.main .reviews ul li .title {display:flex;   justify-content: space-between; }
.main .reviews ul li .title strong {font-size:1.125rem; color:#111; font-weight:500; width:calc(100% - 90px)}
.main .reviews ul li .title strong img {display:inline-block; vertical-align:middle; margin-left:.3rem; height:20px}
.main .reviews ul li .title .date {font-size:.9rem; color:#666; width:90px; text-align:right;}
.main .reviews ul li .text { display:block; position:relative;  font-size:.925rem; line-height:1.4em; color:#76787f; /*overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical;*/}
.main .reviews ul li .nation {display:flex;align-items: center; justify-content: space-between;font-size:.95rem; color:#333; font-weight:400; margin-top:.5rem; }
.main .reviews ul li .nation img {display:inline-block;vertical-align:middle; margin-right:.35rem;}
.main .reviews ul li figure {display:block;  border-radius:.5rem; overflow:hidden; max-height:14.5rem;}
.main .reviews ul li figure img { width:100%; }

@media screen and ( max-width:900px ) {
    .main .reviews ul li figure { max-height:13rem;}
	.main .reviews ul li .text {font-size:.9rem; }
}

.reviews {background-color:#fff; margin-top:2rem;}
.reviews ul {font-size:0;}
.reviews ul li {display:inline-block; vertical-align:top;  margin:0 10px; width:calc(25% - 20px);  overflow:hidden; margin-bottom:1rem; }
.reviews ul li .txt_box {padding:1rem .25rem 0; display:flex; flex-direction: column; gap:.5rem; }
.reviews ul li .title {display:flex;   justify-content: space-between; }
.reviews ul li .title strong {font-size:1.125rem; color:#111; font-weight:500; width:calc(100% - 90px)}
.reviews ul li .title strong img {display:inline-block; vertical-align:middle; margin-left:.3rem; height:20px}
.reviews ul li .title .date {font-size:.9rem; color:#666; width:90px; text-align:right;}
.reviews ul li .text { display:block; position:relative;  font-size:.925rem; line-height:1.4em; color:#76787f; /*overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical;*/}
.reviews ul li .nation {display:flex;align-items: center; justify-content: space-between;font-size:.95rem; color:#333; font-weight:400; margin-top:.5rem; }
.reviews ul li .nation img {display:inline-block;vertical-align:middle; margin-right:.35rem;}
.reviews ul li figure {display:block;  border-radius:.5rem; overflow:hidden;}
.reviews ul li figure img { width:100%; }



/* slick */
.slick-prev {position: absolute; top:50%; margin-top:-25px;  left:-20px; width:40px; height:40px; border-radius:50%;  background-color:#fff; box-shadow:2px 2px 5px rgba(0,0,0,0.1); font-size:0; z-index:33}
.slick-prev:after {content: '\e93d'; font-size:16px; font-weight:bold; color:#333; margin-top:3px;}
.slick-next {position: absolute; top:50%; margin-top:-25px; right:-20px; width:40px; height:40px; border-radius:50%; background-color:#fff; box-shadow:2px 2px 5px rgba(0,0,0,0.1); font-size:0; z-index:33}
.slick-next:after {content: '\e940'; font-size:16px; font-weight:bold; color:#333;margin-top:3px;}
.slick-prev:hover:after,
.slick-next:hover:after{opacity:1; }
.slick-prev,
.slick-next{ display:flex; justify-content: center;align-items: center;}


.slick-dots { display:block; text-align:center; margin:0; padding:0; margin-top:1rem;}
.slick-dots>li {display: inline-block;vertical-align: top; border:1px !important;min-height:.5rem !important; width: .5rem !important;height:.5rem !important;margin: 0 5px !important; padding:0 !important; background-color:#d2d7db; border-radius: 3rem !important;cursor: pointer;
                   -webkit-transition: all 400ms;transition: all 400ms;}
.slick-dots>li:before,
.slick-dots>li:after{display:none !important; }
.slick-dots>li.slick-active {background:var(--color-main) !important; }
.slick-dots>li>button {text-indent:-9999px; display:none !important;}


@media screen and ( max-width:1024px ) {
.mc1_list .slick-list, .mc2_list .slick-list {overflow: visible;margin:0 3px 10px }
.mc3_list .slick-list{overflow: visible !important;margin:0 3px 10px }
.mc1_list li, .mc2_list li {margin:0 3px 10px;  }
.mc3_list li {margin:0 3px 10px;  }
.carlist li {margin:0 5px 1rem !important;}
.reviews ul li {margin:0 5px 0rem !important;}
.recommend ul li {margin:0 5px 1rem !important;}
}



/* **************************************** *
 *  river's video
 * **************************************** */
.mainVideos { width:1200px; position:relative; margin: 0 auto; }
.mainVideos .mainVideoBox { font-size:0; }
.mainVideos .mainVideoBox .playArea { display:inline-block; vertical-align:top; margin-right: auto;width:calc(100% - 400px); border-radius:.65rem; overflow:hidden;}
.mainVideos .mainVideoBox .playArea img { height: 100%; }
.mainVideos .mainVideoBox .playArea .youtube_area { height: 450px; }
.mainVideos .mainVideoBox .playArea .youtube_area iframe{border:none; width:100%;}
.mainVideos .mainVideoBox ul {display:inline-block; vertical-align:top;  width:400px; padding-left:1.8rem;height: inherit; overflow-y: auto;}
.mainVideos .mainVideoBox ul::-webkit-scrollbar { width: 4px;}
.mainVideos .mainVideoBox ul::-webkit-scrollbar-track { background-color: #fff;}
.mainVideos .mainVideoBox ul::-webkit-scrollbar-thumb { background-color: #ddd;}
.mainVideos .mainVideoBox ul li {padding:.5rem 0; }
.mainVideos .mainVideoBox ul li.on { background-color: #f4f7fa; }
.mainVideos .mainVideoBox ul li.on .title { color:var(--color-blue)}
.mainVideos .mainVideoBox ul li .title { width:calc(100% - 120px);margin-top: 8px; padding:0px 7px 8px; font-size:.95rem; font-weight:500; display:flex;align-items: center; }
.mainVideos .mainVideoBox ul li .youtube_list {  position: relative; display: flex;gap:.5rem; cursor: pointer; padding:0px;}
.mainVideos .mainVideoBox ul li .youtube_list img { width: 120px; height: 75px;}
.mainVideos .mainVideoBox ul li .youtube_list .youtube_ico { cursor: pointer; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ""; background:url(/images/main/ico_youtube.png) no-repeat center ; background-size:auto 100%;width: 40px; height: 25px;}


@media screen and ( max-width:1200px ) {
	.video {width:100%;}
	.mainVideos{width:100%;}
}

@media screen and ( max-width:1024px ) {
	.mainVideos .mainVideoBox .playArea { width:calc(100% - 130px); }
	.mainVideos .mainVideoBox .playArea .youtube_area { height: 350px; }
	.mainVideos .mainVideoBox ul { width:130px; height:350px; display:inline-flex; flex-direction: column; gap:.65rem; padding-left:1rem; }
	.mainVideos .mainVideoBox ul li { padding:0; }
	.mainVideos .mainVideoBox ul li .youtube_list { flex-direction: column; border-radius:.35rem; overflow:hidden; }
	.mainVideos .mainVideoBox ul li .title {display:none;}
}

@media screen and ( max-width:640px ) {
	.mainVideos .mainVideoBox .playArea { width:100%; }
	.mainVideos .mainVideoBox .playArea .youtube_area { height: 320px; }
	.mainVideos .mainVideoBox ul { display:flex; flex-direction: row; width:100%; height:auto; margin-top:.5rem; padding:0; gap:.35rem; }
}
@media screen and ( max-width:460px ) {
	.mainVideos .mainVideoBox .playArea .youtube_area { height: 240px; }
}
@media screen and ( max-width:390px ) {
	.mainVideos .mainVideoBox .playArea .youtube_area { height: 200px; }
	.mainVideos .mainVideoBox ul li .youtube_list img { width: 70px; height: 50px; }
}