@font-face {
    font-family: 'SBAggroB';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/SBAggroB.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

.sub_con {width:100%; max-width:1100px; margin:0 auto; padding-bottom:50px; box-sizing:border-box;  font-size:16px; }
.sub_con h2.guide {font-size:2.2rem; font-family:'SBAggroB'; font-weight:800;  line-height:1; display:block; margin-bottom:20px; margin-top:70px;}
.sub_con h2.guide.kr {font-family:'Pretendard'}
.sub_con.shop h2.guide   {margin-bottom:30px;}

.sub_con h3.sub_h3 {font-size:1.5rem; }

hr.con_hr {margin:20px 0}

.sub_menu {width:100%; max-width:1100px; margin:0 auto; box-sizing:border-box;   }

.product_search {display:flex; height:35px;  margin-bottom:20px; width:100%;   box-sizing:border-box; }
.product_search .input_box {background-color:#ddd; border-radius:5px; display:flex; box-sizing:border-box; line-height:0; padding:0 5px;  height:35px;  }
.product_search .input_box svg { }
.product_search .input_box a {  margin-top:5px; display:inline-block }
.product_search  .input_box input {border:none; height:100%; background-color:#ddd; color:#fff  }


.shop_cate {width:100%;   width:100%;  }
.shop_cate ul {width: 100%;  box-sizing:border-box; 
    
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    line-height: 0;
    font-size: 0; display:flex; justify-content:space-between}

.shop_cate ul li {font-size:1.45rem; line-height:1.2; font-family: 'GmarketSansMedium'; letter-spacing:.5px; font-weight:600}
.shop_cate ul li a { color:#333 !important}
.shop_cate ul li a:hover {color:#ff4a00 !important;  }
.shop_cate ul li.on a {color:#ff4a00  !important;  }

.list_top {display:flex; width:100%; font-size:1em}
.list_top  ul {display:flex; margin-left:auto}
.list_top  ul  li {padding-left:10px; }
.list_top  ul  li a {color:#666}
.list_top  ul  li.ov a {font-weight:600; color:#ff4a00 }


ul.gall_list {width:100%;    display:flex; margin-top:20px; margin-bottom:20px; flex-wrap:wrap}
ul.gall_list  li {width:19%;  box-sizing:border-box; position:Relative; margin-right:1.23%} 

ul.gall_list li div {width:100%; padding-bottom:100%; position:relative; border-radius:10px; overflow:hidden }
ul.gall_list li img {  min-width:100%; position:absolute;  left:50%; top:50%; transform: translate(-50%, -50%);   transition: all .6s; }
/* ul.gall_list li:hover  img {min-width:140%}
 */
ul.gall_list li h4 {font-size:1em; font-weight:400; line-height:1.2; display:block; margin-top:20px}
ul.gall_list li h3 {font-size:1.3em; font-weight:700; line-height:1.3; display:block; margin:5px 0 }
 
ul.gall_list li p {font-size:1em; font-weight:400; line-height:1.35; color:#555;
    width: 100%; }
ul.gall_list a:hover li h3 {color:#ff4a00; }
ul.gall_list a:hover li p {color:#111}

ul.gall_list span.heart {position:absolute; right:5%; top:4%; z-index:999; font-size:2rem; color:#ddd; }
ul.gall_list span.heart_ov {position:absolute; right:5%; top:4%; z-index:999; font-size:2rem; color:red; }

ul.gall_list.col-3  li {width:32.5%;  } 
ul.gall_list p.price span {font-size:.95em; text-decoration:line-through; color:#444}
ul.gall_list p.price b {font-size:1.3em; letter-spacing:-1px; font-weight:600; color:#333; margin-left:5px}


#heart {
 cursor:pointer;
  color: grey;  
  font-size: 40px;
}

#heart.red {
  color: red;
}


 @media all and (max-width:1101px) {
	.sub_con {padding-left:4%; padding-right:4%;  }
	.product_search {padding-left:4%; padding-right:4%}
	.shop_cate ul {padding-left:4%; padding-right:4%}


}
 @media all and (min-width:950px) {
  	 ul.gall_list  li:nth-child(5n) {  margin-right:0}
  	 ul.gall_list li:nth-child(n + 6) {margin-top:30px}

  	 ul.gall_list.col-3  li:nth-child(5n) { margin-right:1.23%}
  	 ul.gall_list.col-3  li:nth-child(3n) {  margin-right:0}
  	 ul.gall_list.col-3 li:nth-child(n + 4) {margin-top:30px}


 }

 @media all and (max-width:950px) {
		.sub_con  {font-size:15px; padding-bottom:20px}

		.sub_con h2.guide {font-size:1.5rem;  margin-top:30px; margin-bottom:20px}
		.sub_con.shop h2.guide {margin-bottom:20px;}

		.sub_con h3.sub_h3 {font-size:1.2rem; }

		hr.con_hr {margin:10px 0}

		.product_search {margin-top:20px; height:30px;}
		.shop_cate {  margin-top:15px}
		.shop_cate ul li {font-size:1.2rem;  padding-right:20px; }
		ul.gall_list {margin-bottom:20px; margin-top:15px; justify-content:space-between}
		ul.gall_list li {width:48%; margin-right:0;} 
		ul.gall_list li:nth-child(n + 3) {margin-top:20px}
		ul.gall_list li h3 {font-size:1.1em;  margin:5px 0 3px 0 }

		ul.gall_list li p {font-size:.95em}

		ul.gall_list.col-3 li {width:48%; margin-right:0;} 
		ul.gall_list.col-3 li:nth-child(n + 3) {margin-top:20px}
}


.story_box {width:100%; display:flex; padding:8% 0;  background:url('/common/img/story_bg.png') no-repeat top; background-size:cover;  }
.story_box img {max-width:100%}

.story_box div.text {width:100%; max-width:1300px;   margin:0 auto;}
.text .in_box {display:flex; align-items:center; margin-bottom:50px; box-sizing:border-box; padding:0 3%}
.text .in_box p.img   {width:45%}
.text .in_box p img {width:100%}
.text .in_box div  { width:55%; }
.text .in_box div h3  {font-size:2em; line-height:1.3}
.text .in_box div div {font-size:1.2em; line-height:1.5; box-sizing:border-box;  width:100%; padding-left:50px; display:block}
.text .in_box div h3 span {padding-left:50px; line-height:1.2; box-sizing:border-box; width:100%; display:inline-block}
.text .in_box div div hr {margin:4px 0}



h2.guide2 {font-size:2.5rem; font-weight:800;  line-height:1; display:block; margin-bottom:20px; }


.story_list {width:80%; margin:0 auto}
.story_list li {width:70%; display:flex; align-items:center; font-size:1.5em}
.story_list li:nth-child(n + 2) { margin-top:-8%;}
.story_list li p.img {margin-right:4%}
.story_list li img {width:100%; }
.story_list li div { }
.story_list li div h4 {color:#003084; display:flex; align-items:center}
.story_list li div h4 span {width:50px; color:#666;  display:inline-block}
.story_list li div p  {padding-left:50px; width:100%; box-sizing:border-box; padding-top:5px; color:#111}

.story_list li:nth-child(2n) {margin-left:auto; justify-content:flex-end}

.story_list li:nth-child(2n) p.img {order:2; text-align:right; margin-right:0; margin-left:4%  }
.story_list li:nth-child(2n) div {order:1}

.story_list li:nth-child(1) p img {max-height:350px}
.story_list li:nth-child(2) p img {max-height:260px}
.story_list li:nth-child(3) p img {max-height:400px}
.story_list li:nth-child(4) p img {max-height:220px}

 @media all and (max-width:1200px) {
 	.text .in_box div h3  {font-size:1.5em}
    .story_list {width:90%;  }
    .story_list li {font-size:1.3em}
	.story_list li:nth-child(n + 2) { margin-top:-3%;}
}

 @media all and (max-width:950px) {

		.story_box { padding:2% 0; }
		.text .in_box {padding:0 4%; box-sizing:border-box; flex-wrap:wrap}
		.text .in_box p.img   {width:90%; margin:0 auto}
		.text .in_box div  {width:100%; margin-top:10px; margin-left:auto;  font-size:1em}
		.text .in_box div h3  {font-size:1.3em}
		.text .in_box div div {font-size:.97em;  padding-left:0; margin-top:0; line-height:1.4}
		.text .in_box div h3 span {padding-left:0}

		 
         h2.guide2 {font-size:1.5rem;    }

		.story_list {width:100%;  box-sizing:border-box; padding:0 4%; margin-top:10px; padding-bottom:50px }
		.story_list li:nth-child(n + 2) { margin-top:0;}
		.story_list li p.img {width:35%; margin-right:4%;  margin-left:0}
		.story_list li {width:100%;  font-size:1.1em}
		.story_list li div h4 span {width:30px; }
		.story_list li div p  {padding-left:30px; font-size:.96em}


		.story_list li:nth-child(2n) p.img {  margin-left:4%; margin-right:0}
		.story_list li:nth-child(2n) div {text-align:right}
		.story_list li:nth-child(2n) div h4 {justify-content:flex-end }
		.story_list li:nth-child(2n) div h4 span {order:1}
		.story_list li:nth-child(2n) div p  {padding-left:0; padding-right:30px; }



}

.shop_view {width:100%; display:flex}
.shop_view_img {width:50%; display:flex;   }
.shop_view_img img {max-width:100%}
.shop_view_img .b_img {width:75%; padding-bottom:75%; position:relative; overflow:hidden  }
.shop_view_img .b_img img { position:absolute; left:50%; top:50%; transform: translate(-50%, -50%); width:100% }
.shop_view_img ul {width:25%; }
.shop_view_img ul li {width:100%; position:relative; padding-bottom:100%; overflow:hidden }
.shop_view_img ul li img { position:absolute;left:50%; top:50%; transform: translate(-50%, -50%); width:100% }

.shop_view_text {width:48%; margin-left:auto; font-size:1.1em; color:#444}
.shop_view_text h3 {font-size:1.8em;   padding-bottom:20px; display:block; color:#111}

#wish_btn {width:48%; max-width:150px; line-height:50px;  background-color:#ddd;   color:#fff !important; font-size:1.15rem; border-radius:5px; font-weight:600; text-align:center; display:inline-block; transition: background-color 0.1s ease-in; cursor:pointer; margin-top:30px; white-space:nowrap; }
#wish_btn.red {background-color:#ff4a00}

.shop_view_text a  {width:48%; max-width:150px; line-height:50px;  background-color:#ff4a00;   color:#fff; font-size:1.15rem; border-radius:5px; font-weight:600; text-align:center; display:inline-block; transition: background-color 0.1s ease-in; cursor:pointer; margin-top:30px; white-space:nowrap;}


 @media all and (max-width:950px) {
		.shop_view {flex-wrap:wrap; }
		.shop_view_img {width:100%}
		.shop_view_text {width:100%; margin-top:30px; font-size:1.05em}
		.shop_view_text h3 {font-size:1.3em; padding-bottom:10px }

		  #wish_btn { font-size:1.05rem;  line-height:45px; margin-top:15px}
		  .shop_view_text a  { font-size:1.05rem;  line-height:45px; margin-top:15px}


}




/* 스토리 230619수정 */

.storybox{text-align:center;}

.story1{ display:inline-block;margin:190px  auto;}
.story1 h2{position:relative; font-size:1.8em;font-weight:700}
.story1 span{background:#fff;padding:0 10px;}
.story1 h2::before{
    border-top: 4px solid #000;
    content: "";
    margin: 0 auto;
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    z-index: -1;
	box-sizing:border-box;
    border-left: 4px solid #000;
    border-right: 4px solid #000;
}

.story1  p{position:relative;border-bottom:4px solid #000;padding:40px 50px;box-sizing:border-box;font-size:1.8em;font-weight:700;font-family:'SBAggroB';}
.story1  p::before{
    border-left: 4px solid #000;
    border-right: 4px solid #000;
    content: "";
    margin: 0 auto;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
height:100%;
    z-index: -1;
	box-sizing:border-box
}


.orange_bg{
margin-top:120px;
font-size:2em;
width: 100%;
background: url('/common/img/orange_bg.png') no-repeat bottom;
background-size: cover;
padding-bottom:13%;
font-weight:700;
line-height:1.4
}

.en{font-family:'SBAggroB';}


@media (max-width: 950px){
		.logoimg img{width:200px;}
		.story1{margin:15% 5%}
		.story1 h2{font-size:1em}
		.story1 p{font-size:1.1em;line-height:1.4;padding:5% 8%}
		.orange_bg{font-size:1.2em;margin-top:10%;padding:0 5%;width:90%;padding-bottom:20%;word-break:keep-all}
}



.cart_table {width:100%; display:flex; align-items:center; border-bottom:1px solid #ddd; border-top:2px solid #333; }
.cart_table p.img {width:120px; flex-shrink:0; margin:0 20px; }
.cart_table h3 {font-size:1.5em; margin-bottom:5px; font-weight:600}
.cart_table p.button {margin-left:auto; margin-right:10px; }

.cart_pay {width:100%; background-color:#f7f7f7; padding:20px 0;  display:flex; align-items:Center; justify-content:center; font-size:1.2em}
.cart_pay p {margin:0 20px; text-align:Center}

.cart_h3 {font-size:1.4em; color:red; margin-bottom:10px}

.order_list .cart_h3 {margin-top:20px}
.order_list .cart_table {cursor:pointer}
.order_list .cart_table:nth-child(2) {margin-top:0}

.info_bg_box {background-color:#f7f7f7; padding:15px; width:100%; display:inline-block; box-sizing:border-box}


.option {width:100%; margin-top:25px; }
.option li  {width:100%;  display:flex; align-items:Center; margin-bottom:10px}
.option li h3 {width:100px; font-size:1em; padding-bottom:0 }
.option li select {width:calc(100% - 100px); height:30px; font-size:.95rem; padding:0 2px; box-sizing:border-box  }
.pay {font-size:1.1em; font-weight:500; width:100%; text-align:right; margin-top:15px; color:#111}

.cart_btn {width:100%; display:flex; justify-content:space-between}
.cart_btn #wish_btn {width:20%; max-width:20%}
.cart_btn a {width:38%; max-width:38%}
.cart_btn a:nth-child(2) {background-color:#333}

.option_plus {width:100%;  border-bottom:1px solid #ddd; padding:8px 0; font-size:.95em }
.option_plus div.flex_in { width:100%; display:flex; align-items:center; margin-top:5px; }
.option_plus div.flex_in .number {border:1px solid #ddd; width:100px; flex-shrink:0; display:flex;  } 
.option_plus div.flex_in .number span {width:30px; flex-shrink:0;  background-color:#ddd; text-align:center; line-height:30px; cursor:pointer}
.option_plus div.flex_in .number p {width:100%;  text-align:Center; line-height:30px; height:30px; float:left; font-size:15px; background-color:#fff}
.option_plus div.flex_in p {margin-left:auto; font-size:.90em }
.option_plus  div.flex_in a {background-color:#fff; font-weight:300; font-size:.95em;  width:auto; padding:0; margin:0; color:#555; line-height:1}

.radio_wrap span {display:inline-block; margin:2px 0; margin-right:10px}

@media (max-width: 950px){

	.cart_table {padding:13px 0}
	.cart_table p.img {width:65px;  margin:0; margin-right:5px }
	.cart_table h3 {font-size:1.15em; margin-bottom:5px;  }
	.cart_table p.button {  margin-right:0; }
	.cart_table a.s_btn  { flex-shrink:0;font-size:.7rem; line-height:20px; width:25px; padding:0; text-align:center}
	.cart_pay {flex-wrap:wrap; font-size:1.1em}
	.cart_pay p {margin:2px 3px}
	.cart_pay p br {display:none}
	.cart_pay p:last-child {width:100%}

}