/* 리스트 */
.productListMain { display:flex; justify-content:; flex-wrap:wrap; }
.productListMain li { position:relative; width:18%; height:100%; margin:1.5% 1%; }
.productListMain li .img  { border: 1px#e0e0e0 solid; display: block;  }
.productListMain li .img img  {width:100%; height:100%; }
.productListMain li .caption { margin-top:10px; width:100%; font-family: 'Noto Sans KR', sans-serif; font-size:1.0em;  line-height:1.4em; text-align:center;}

/* 뷰 */
.Viewtitle { display:none;}
.shopView {position:relative; overflow:hidden; width:100%; margin:0 auto;}
.shopView > .top {display:flex; justify-content:space-between;}
.shopView > .top > .imgs { display:flex; align-items:center; width:35%; border:1px#e0e0e0 solid; }
.shopView > .top > .imgs > .bigImg { width:100%;  overflow:hidden;}
.shopView > .top > .imgs > .bigImg > img { width:100%; height:100%; border-bottom:0px#e0e0e0 solid;}
.shopView > .top > .imgs > .thumImg { display:none; width:100%;  overflow:hidden; }
.shopView > .top > .imgs > .thumImg  img { width:20%;  float:left; }

.shopView > .top > .contents { display:flex; flex-direction:column; width:60%; overflow:hidden; padding-bottom: ; }
.shopView > .top > .contents > .cate { background:#1dac4a; border-radius:5px; margin-bottom:15px; padding:10px 5px; width:20%; font-family: 'Noto Sans KR', sans-serif; font-size:0.9em; color:#fff; font-weight:400; line-height:1.2em; text-align:center; }
.shopView > .top > .contents > .title { font-family: 'Noto Sans KR', sans-serif; font-size:2.0em; color:#222; font-weight:600; line-height:1.3em; text-align:left; }
.shopView > .top > .contents > .model { margin:5px 0; font-family: 'Noto Sans KR', sans-serif; font-size:1.5em; color:#0faddb; font-weight:500; line-height:1.2em; text-align:left; }
.shopView > .top > .contents > .text { border-top:1px solid#333; margin-top:25px; padding-top:25px;  }
.shopView > .top > .contents > .text ul li { list-style-type:disc; list-style-position:outside; margin-left:30px; padding-left:0; font-family: 'Noto Sans KR', sans-serif; font-size:1.0em; font-weight:400; line-height:2.0em; }
.shopView > .top > .contents > .file { margin-top:25px; margin-left:50px;  }
.shopView > .top > .contents > .file a { color:#000000;  font-size: 12px;     }
.shopView > .top > .contents > .btn { display:flex; margin-top:auto; margin-left:auto; width:100%; }
.shopView > .top > .contents > .btn > div {  margin: 20px 0 0 0; width:100%; }
.shopView > .top > .contents > .btn > .type1 > a{ font-weight:500; color:#fff; background:#fe434c; width:130px; line-height:38px; border:1px#fe434c solid; text-align: center; display:block;}
.shopView > .top > .contents > .btn > .type2 > a{font-weight:500; margin-left:5px; color:#fff; background: linear-gradient(to bottom, #222 100%, #fff 100%); width:100%; line-height:60px; border:0px#cdcdcd solid; font-size:1.3em; text-align: center; display:block;}
.shopView > .top > .contents > .btn > .type2 > a:hover{color:#fff; background:#ed1c24; border:0px#666 solid; }

.shopView > .detailView { clear:left; margin-top:70px; }
.shopView > .detailView > .title {padding-left:0;  border-bottom:1px#e1e1e1 solid; border-top:1px#2d2d2d solid; }
.shopView > .detailView > .contents { font-size:12px; margin-top:20px;}
.shopView > .afterNote {display:block;}


/* 탭메뉴 */
#css_tabs input:nth-of-type(1), #css_tabs input:nth-of-type(1) ~ div:nth-of-type(1),
#css_tabs input:nth-of-type(2), #css_tabs input:nth-of-type(2) ~ div:nth-of-type(2) { display:none }
#css_tabs input:nth-of-type(1):checked ~ div:nth-of-type(1),
#css_tabs input:nth-of-type(2):checked ~ div:nth-of-type(2) {display:block}

 /* 라벨 기본 스타일 지정 */
#css_tabs > label {
     display:inline-block;
     font-variant:small-caps;
     font-size:1.0em;
     padding:15px 0; margin-right:-4px;
     text-align:center;
     width:50%;
     line-height:1.8em;
     font-weight:;
     border-radius:0;
     background:#f5f5f5;
     color:#;
     border-top:1px solid#d8d8d8;
    /* border-width:1px 1px 0; */
	 z-index:9999;
 }
#css_tabs > label:hover {
     cursor:pointer
 }
#css_tabs label[for=tab1] {
     margin-left:0
 }

 /* 선택된 라벨, 커서를 올린 라벨 스타일 지정 */
#css_tabs input:nth-of-type(1):checked ~ label:nth-of-type(1), /*#css_tabs > label[for=tab1]:hover, */
#css_tabs input:nth-of-type(2):checked ~ label:nth-of-type(2) {
     background:#0faddb; border-top:1px solid#0faddb;
     color:#fff; font-weight:500; font-size:1.0em;
 }

 /* 실제 내용이 담긴 div 요소 스타일 지정 */
#css_tabs .tab1_content { padding-top:40px; margin-top:; border-top:1px solid#0faddb; height:100%; font-size:1.0em; z-index:9; } 
#css_tabs .tab2_content { padding-top:40px; margin-top:; border-top:1px solid#0faddb; height:100%; font-size:1.0em; z-index:9; } 
#css_tabs .tab1_content .contents, #css_tabs .tab2_content .contents { width:80%; margin:0 auto; }
#css_tabs .tab1_content .contents img, #css_tabs .tab2_content .contents img { width:100%;}
#css_tabs .tab2_content .file_wrap {border-top:1px solid#e0e0e0; margin-top:30px; padding-top:30px;}
#css_tabs .tab2_content .file_name { margin-bottom:20px; text-align:center;}
#css_tabs .tab2_content .file_btn a { display:block; background:#4d4d4d; border-radius:30px; border:1px solid#4d4d4d; width:180px; margin:0 auto 30px; padding:15px 0; font-size:1.1em; color:#fff; left:2.5em; text-align:center; letter-spacing:1.0px; transition:all 0.5s}
#css_tabs .tab2_content .file_btn a:hover { background:#F00; border:1px solid#F00; transition:all 0.5s }
#css_tabs .tab1_content img, #css_tabs .tab2_content img { width:80%; margin:0 auto;}



@media (max-width:767px){
	
/* 리스트 */	
.productListMain { display:flex; justify-content:; flex-wrap:wrap; }
.productListMain li { position:relative; width:46%; height:100%; margin:0 1.5% 6% 1.5%; }
.productListMain li .img  { border: 1px#e0e0e0 solid; display: block;  }
.productListMain li .img img  {width:100%; height:100%; }
.productListMain li .caption { margin-top:5px; width:100%; font-family: 'Noto Sans KR', sans-serif; font-size:0.95em;  line-height:1.3em; text-align:center;}

	 
/* 뷰 */
.shopView {position:relative; overflow:hidden; width:100%; margin:0 auto;}
.shopView > .top {display:flex; justify-content:space-between; flex-wrap:wrap; }
.shopView > .top > .imgs { display:flex; align-items:center; width:100%; border:1px#e0e0e0 solid; }
.shopView > .top > .imgs > .bigImg { width:100%;  overflow:hidden;}
.shopView > .top > .imgs > .bigImg > img { width:100%; height:100%; border-bottom:0px#e0e0e0 solid;}
.shopView > .top > .imgs > .thumImg { display:none; width:100%;  overflow:hidden; }
.shopView > .top > .imgs > .thumImg  img { width:20%;  float:left; }

.shopView > .top > .contents { display:flex; flex-direction:column; width:100%; margin-top:20px;overflow:hidden; }
.shopView > .top > .contents > .cate { background:#1dac4a; border-radius:5px; margin-bottom:10px; padding:5px; width:40%;  font-family: 'Noto Sans KR', sans-serif; font-size:0.9em; color:#fff; font-weight:400; line-height:1.2em; text-align:center; }
.shopView > .top > .contents > .title { font-family: 'Noto Sans KR', sans-serif; font-size:1.3em; color:#222; font-weight:600; line-height:1.4em; text-align:left; }
.shopView > .top > .contents > .model { margin:5px 0; font-family: 'Noto Sans KR', sans-serif; font-size:1.2em; color:#0faddb; font-weight:500; line-height:1.2em; text-align:left; }
.shopView > .top > .contents > .text { border-top:1px solid#333; margin-top:12px; padding-top:15px; }
.shopView > .top > .contents > .text ul li { list-style-type:disc; list-style-position:outside; margin-left:20px; padding-left:0; font-family: 'Noto Sans KR', sans-serif; font-size:1.0em; font-weight:400; line-height:1.6em; }

.shopView > .top > .contents > .btn { padding:0; overflow:hidden; position:relative; float:; width:60%; margin:0 auto;}
.shopView > .top > .contents > .btn > div { float:left; margin:10px 0 0 2px; width:100%;}
.shopView > .top > .contents > .btn > .type1 > a{ color:#fff;font-size: 0.9rem; background:#fe434c; width:80px; line-height:30px; border:1px#fe434c solid; text-align: center; display:block;}
.shopView > .top > .contents > .btn > .type2 > a{ color:#fff;font-size:1.0rem; background: linear-gradient(to bottom, #222 100%, #fff 100%);width:100%; line-height:45px; border:0px#cdcdcd solid; text-align: center; display:block;}

.shopView > .detailView {clear:left;margin-top:40px;}
.shopView > .detailView > .title { color:#333333;  font-size: 1.1rem; font-weight:bold;  border-bottom:1px#b1b1b1 solid; border-top:1px#b1b1b1 solid; }
.shopView > .detailView > .title img{ height:32px; }
.shopView > .detailView > .contents { font-size:12px;margin-top:20px;}
.shopView > .afterNote {display:none;} 

/* 탭메뉴 */
#css_tabs input:nth-of-type(1), #css_tabs input:nth-of-type(1) ~ div:nth-of-type(1),
#css_tabs input:nth-of-type(2), #css_tabs input:nth-of-type(2) ~ div:nth-of-type(2) { display:none }
#css_tabs input:nth-of-type(1):checked ~ div:nth-of-type(1),
#css_tabs input:nth-of-type(2):checked ~ div:nth-of-type(2) {display:block}

 /* 라벨 기본 스타일 지정 */
#css_tabs > label {
     display:inline-block;
     font-variant:small-caps;
     font-size:0.9em;
     padding:10px 0; margin-right:-4px;
     text-align:center;
     width:50%;
     line-height:1.4em;
     font-weight:;
     border-radius:0;
     background:#f5f5f5;
     color:#;
     border-top:1px solid#d8d8d8;
    /* border-width:1px 1px 0; */
	 z-index:9999;
 }
#css_tabs > label:hover {
     cursor:pointer
 }
#css_tabs label[for=tab1] {
     margin-left:0
 }

 /* 선택된 라벨, 커서를 올린 라벨 스타일 지정 */
#css_tabs input:nth-of-type(1):checked ~ label:nth-of-type(1), /*#css_tabs > label[for=tab1]:hover, */
#css_tabs input:nth-of-type(2):checked ~ label:nth-of-type(2) {
     background:#0faddb; border:1px solid#0faddb;
     color:#fff; font-weight:500; font-size:0.9em;
 }

 /* 실제 내용이 담긴 div 요소 스타일 지정 */
#css_tabs .tab1_content { padding-top:20px; margin-top:; border-top:1px solid#0faddb; height:100%; font-size:1.0em; z-index:9; } 
#css_tabs .tab2_content { padding-top:20px; margin-top:; border-top:1px solid#0faddb; height:100%; font-size:1.0em; z-index:9; } 
#css_tabs .tab1_content .contents, #css_tabs .tab2_content .contents { width:100%; }
#css_tabs .tab1_content .contents img, #css_tabs .tab2_content .contents img { width:100%; }
#css_tabs .tab2_content .file_wrap {border-top:1px solid#e0e0e0; margin-top:20px; padding-top:20px;}
#css_tabs .tab2_content .file_name { margin-bottom:10px; text-align:center;}
#css_tabs .tab2_content .file_btn a { display:block; background:#4d4d4d; border-radius:30px; border:1px solid#4d4d4d; width:140px; margin:0 auto 30px; padding:10px 0; font-size:0.9em; font-weight:500; color:#fff; left:2.0em; text-align:center; letter-spacing:0.5px; transition:all 0.5s}
#css_tabs .tab2_content .file_btn a:hover { background:#F00; border:1px solid#F00; transition:all 0.5s }
#css_tabs .tab1_content img, #css_tabs .tab2_content img { width:100%; margin:0 auto;}

 }
