@import url('https://fonts.googleapis.com/css2?family=Cardo&display=swap');
@import url(/resources/css/nanum-myeongjo.css);
@import url(//fonts.googleapis.com/earlyaccess/nanumgothic.css);

html{overflow-y: scroll; overflow-x: hidden;}
*{margin: 0; padding: 0; border: 0; text-indent: 0;}
a{text-decoration: none; color: #333;}
img{border: 0;}
ul, ol, li{list-style: none;}

#contents.pcon{width: 1200px; margin: 50px auto 70px auto;}

.cf:after{clear: both; content: ''; display: block;}
.left{float: left;}
.right{float: right;}

.g_con span, .g_con strong, .g_con em, .g_con a, .g_con img{display: block; text-align: left;}
/* 변경예정인 초기화 코드 */

/* list_page */
/* WRAP */
#wrap_g{width: 1200px; margin: 0 auto;}
#wrap_g *{font-family: 'Noto Sans KR', sans-serif;}
/* HEAD IMG */
.top_title{width: 100%; height: auto; margin-top: 70px; padding-bottom: 20px; position:relative;}
.top_title img:first-child{width: 216px; float: left;}
.top_title img:last-child{width: 289px; float: right;}
.sub_tit_right {position: absolute; right: 0;top: 9px;}
/* G & LSIT CONTAINER */
.g_con{width: 1268px; overflow:visible; margin-top: 6px; margin-left: -10px;}
.g_con .g_list{width: 1268px; }
.g_con .g_list li.g_info{width: 385px; height:680px; padding: 0 11px; margin-bottom: 25px; position: relative;}
/* IMG & VIDEO */
.g_con .g_list li.g_info .g_img{width: 385px; height: 500px; display: block;  margin: 0 auto; overflow: hidden; margin-bottom: 15px; position: relative;}
.g_con .g_list li.g_info .g_img > img{width: 100%; height: auto;}
.g_con .g_list li.g_info .g_img > .g_img_modal{width: 100%; height: 100%; position: absolute; background-image: url(/resources/images/2020_present/bg_op_bl.png); opacity: 0; top: 0; left: 0; line-height: 1.2em; text-align: center; display: block;}
.g_con .g_list li.g_info .g_img > .g_img_modal h4{font-size: 42px; font-weight: 500; color: white; position: absolute; width: 100%; top: 215px; left: 0; text-align: center;}
.g_con .g_list li.g_info .g_img > .g_img_modal span{color: white; display: block; text-align: center; line-height: 26px; font-size: 18px; width: 100%; float: left; font-weight: 400; position: absolute; top: 270px; left: 0;}
.g_con .g_list li.g_info .g_img > .g_img_modal img{width: 100%; margin-top: 150px; opacity: 1; float: left;}
/* COPY */
.g_con .g_list li.g_info strong.g_info_head{margin-bottom: 15px; margin-top: 20px; font-size: 21px; font-weight: bold; color: #333; letter-spacing: -0.075em; padding:0 0 10px 0;  border-bottom: 1px solid #ccc;  text-align: left; min-height: 55px; line-height: 1.25;}

#wrap_g .g_con .g_list li.g_info strong.g_info_head{font-family: 'Nanum Gothic', sans-serif;}
/* #wrap_g .g_con .g_list .g_info_txt{font-family: 'Nanum Gothic', sans-serif;}
#wrap_g .g_con .g_list .g_info_txt b{font-family: 'Nanum Gothic', sans-serif;} */


/* .g_con .g_list li.g_info strong.g_info_head br{display: none;} */
.g_con .g_list li.g_info .g_info_con{display: block;}
/* ellipsis */
.g_con .g_list li.g_info .g_info_con .g_info_txt{font-size: 15px; font-weight: normal; color: #444; white-space: normal;  text-overflow: ellipsis; line-height: 1.2; min-height: 100px; display: inline-block; text-align: left; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; word-break: keep-all;}
.g_con .g_list li.g_info .g_info_con .g_info_txt b{display: block; font-weight: normal; color: #717171; padding: 10px 0 10px 11px; line-height: 1; position: relative; margin-top: 10px;font-size: 13px;}
.g_con .g_list li.g_info .g_info_con .g_info_txt b:before{ content: '*'; line-height: 1; width: 10px; height: 10px; position: absolute; top: 50%;margin-top: -4px; left: 0; }
/* /ellipsis */
.g_con .g_list li.g_info .g_info_con .g_info_price{font-weight: 600; color: #444; font-size: 16px;}

/* detail_page os */
/* 사진에리어 */
.photo_wrap{width: 720px; float: left;}
/* 메인 이미지 */
.photo_wrap .thumb{width: 720px; float: left; height: 480px;}
.photo_wrap .thumb img{width: 100%;}
/* 작은 이미지 */
.photo_wrap .thumb_list{width: 100%; overflow: visible;}
.photo_wrap .thumb_list ul{width: 722px; margin-left: -1px; overflow: hidden; height: 126px;}
.photo_wrap .thumb_list ul li{float: left; width: 170px; height: 113px; margin-right: 11px; margin-top: 11px; cursor: pointer; border: 1px solid #fff;}
.photo_wrap .thumb_list ul li:hover{ border: 1px solid #000;}
.photo_wrap .thumb_list ul li:nth-child(4){margin-right: 0;}
.photo_wrap .thumb_list ul li img{width: 100%;}
/* 우측 INFO 애리어 */
.goods_info_wrap{width: 440px; float: right;}
/* 타이틀 부분 */
.goods_info_wrap .goods_info_head{width: 100%; position: relative; height: 68px; border-bottom: 1px solid #f1f1f1;}
.goods_info_wrap .goods_info_head h3{width: 100%; padding-top: 19px;}
.goods_info_wrap .goods_info_head h3 .g_name{float: left; font-size: 21px; font-weight: bold; line-height: 32px; color: #222; font-weight: bold;}
.goods_info_wrap .goods_info_head .new{float: left; display: block; margin-left: 5px; margin-top: 5px;}
.goods_info_wrap .goods_info_head .wrap-card-like{float:right; padding:5px 0 0 0;}
.goods_info_wrap .goods_info_head .wrap-card-like img{width: 26px; height:22px; cursor: pointer;}
.goods_info_wrap .goods_info_head .wrap-card-like em{font-size:12px; float:right; padding:2px 0 0 7px;}

.goods_info_wrap .info_table{display: block; width: 100%;}
.goods_info_wrap .info_table > div{float: left; width: 100%;}

/* .goods_info_wrap .info_table .price_info{background-color: slateblue;} */
.goods_info_wrap .info_table .price_info{line-height: 40px;}
.goods_info_wrap .info_table .price_info > *{display: inline-block; padding: 0 5px;}
.goods_info_wrap .info_table .price_info .discount{font-size: 20px; font-weight: 600; color: orangered; font-style: normal; padding-left: 0;}
.goods_info_wrap .info_table .price_info .price{font-size: 26px; font-weight: 600; color: #121212;}
.goods_info_wrap .info_table .price_info .origin{font-size: 16px; font-weight: 300; color: #7d7d7d; text-decoration: line-through;}

/* .goods_info_wrap .info_table .d_info{background-color: darksalmon;} */
.goods_info_wrap .info_table .d_info{margin-bottom: 30px;}
.goods_info_wrap .info_table .d_info .th{font-weight: bold; display: block; width: 94px; float: left; font-size: 14px; color: #7d7d7d; padding: 5px 7px; padding-left: 0; height: 30px; line-height: 30px;}
.goods_info_wrap .info_table .d_info .td{font-weight: 400; display: block; width: 314px; float: right; font-style: normal; font-size: 13px; color: #3c3c3c; padding: 5px 8px; height: 30px; line-height: 30px;}
.goods_info_wrap .info_table .d_info .detail{font-size: 13px; color: #9f9f9f; font-weight: normal;}

.goods_info_wrap .info_table .select_bx{/*background-color: darksalmon;*/ height: 34px; margin-bottom: 15px;}
.goods_info_wrap .info_table .select_bx em{font-style: normal; line-height: 35px; font-size: 14px; display: block; float: left; color: #666; font-weight: bold; color: #7d7d7d; padding: 5px 7px; height: 30px; line-height: 30px; width: 94px;}
.goods_info_wrap .info_table .select_bx select{width: 331px; height: 40px; font-size: 13px; line-height: 40px; border: 1px solid #ddd; text-align: center; display:  inline-block; float: right; border-radius: 3px; color: #333; appearance: none; background: url(https://www.barunsoncard.com/resources/images/common/bg_arrow2.png) 100% 50% no-repeat;}

option{display: block;}

.count_bx{width: 100%; margin-top: 20px; border-top: 1px solid #ddd; padding-top: 20px; font-size: 14px; display: block;}
.count_bx .price_bx{margin-bottom: 4px;}
.count_bx .price_bx > *{float: left; height: 23px;}
.count_bx .quantity{float: left; position: relative; margin-right: 15px; height: 23px; line-height: 23px;}
.count_bx .quantity .up{right: -11px; position: absolute; top: 0;}
.count_bx .quantity .down{right: -11px; position: absolute; bottom: 0;}
.goods_info_wrap .info_table .count_bx .price_bx .goods_name{font-size: 14px; color: #666; font-weight: 300;}
.goods_info_wrap .info_table .count_bx .price_bx input{width: 34px; text-align: center; height: 19px; line-height: 19px; border-radius: 3px 0 0 3px;}
.goods_info_wrap .info_table .count_bx .price_bx .inner{float: right;}
.goods_info_wrap .info_table .count_bx .price_bx .inner > *{float: left;}
.goods_info_wrap .info_table .count_bx .price_bx .pb_price{width: 70px; display: block; line-height: 23px; padding-left: 8px; text-align: center;}
.goods_info_wrap .info_table .count_bx .price_bx .cancle{width: 11px;}
.goods_info_wrap .info_table .count_bx .price_bx .cancle img{display: block; margin-top: 6px;}
.goods_info_wrap .info_table .count_bx .price_bx{width: 100%;}
.goods_info_wrap .info_table .count_bx .price_bx > span{display: block; width: 50%;}
.goods_info_wrap .info_table .count_bx .price_bx span{font-size: 14px; color: #666;}
.goods_info_wrap .info_table .count_bx .quantity{width: 45px;}



.goods_info_wrap .info_table .total_price{border-bottom: 1px solid #ddd; padding-top: 20px;}
.goods_info_wrap .info_table .total_price .th{width: 50%; float: left; line-height: 50px; font-size: 17px; font-weight: bold; color: #333;}
.goods_info_wrap .info_table .total_price .total{width: 50%; float: right; text-align: right; line-height: 50px; font-size: 20px; font-weight: bold; color: #333;}

.goods_info_wrap .info_table .btn_bx{padding: 18px 0 32px 0;}
.goods_info_wrap .info_table .btn_bx > *{cursor: pointer;}
.goods_info_wrap .info_table .btn_bx .btn_cs{width: 20%; float: left; text-align: center; border: 1px solid #ddd; border-radius: 5px; height: 50px; line-height: 50px; box-shadow: 1px 1px 1px #ddd; font-size: 16px;}
.goods_info_wrap .info_table .btn_bx .btn_rsv{width: 75%; float: right; text-align: center; border-radius: 5px; border: 1px solid #438eb9; background-color: #438eb9; height: 50px; line-height: 50px; color: white; box-shadow: 1px 1px 1px #ddd; font-size: 16px;}

.cs_popup{display: none; width: 350px; height: 456px; position: fixed; top: 50%; left: 50%; margin-left: -175px; margin-top: -200px; background-color: white; border: 1px solid #333; z-index: 9999;}
.cs_popup img{width: 100%;}
.cs_popup:after{width: 16px; height: 16px; position: absolute; top: 10px; right: 13px; background: url(/resources/images/mcard/close2.png); background-size: cover; content: ''; display: block; z-index: 9999999;}



/* 하단 탭부분 */

.tabs .tab-links li{position: relative;}
.tabs .tab-links li.active{z-index: 2;}
.tabs .tab-links li.off{background-color: #f6f6f6; border: 1px solid #e8e8e8; border-bottom: none; margin: 0 0 0 -1px; z-index: 1;}
.txt_bx{margin-top: 80px; margin-bottom: 100px;}
.txt_bx2{margin-top: 80px;}
.txt_c{margin-top: 35px; margin-bottom: 35px;}
.txt_c img{width: 100%; display: block;}
.w_detail2 img{width: 100%; display: block;}

#wrap_g .tabs .tab-content .tab .w_detail2 .tab_head{font-size: 40px; letter-spacing: -1px; line-height: 48px; margin: 30px 0 7px; font-family: 'Noto Sans KR', serif; color: #555; text-align: center; font-weight: 300;}
#wrap_g .tabs .tab-content .tab .w_detail2 .tab_head strong{font-size: 46px; letter-spacing: -1px; line-height: 64px; font-family: 'Noto Sans KR', serif; color: #555; text-align: center; font-weight: bold;}
#wrap_g .tabs .tab-content .tab .w_detail2 .txt_detail{font-size: 17px; color: #757575; line-height: 35px; font-weight: bold; text-align: center; font-family: 'Nanum Myeongjo', serif; letter-spacing: -1px; word-break: keep-all; margin-top: 35px; margin-bottom: 35px;}
#wrap_g .tabs .tab-content .tab .w_detail2 .tab_sub_title{font-size: 22px; color: #414141; text-align: left; width: 100%; display: block; line-height: 2; font-family: 'Nanum Myeongjo', serif; font-weight: 700;}
#wrap_g .tabs .tab-content .tab .w_detail2 .tab_info{margin-bottom: 40px; display: block;}
#wrap_g .tabs .tab-content .tab .w_detail2 .tab_info li{font-size: 16px; line-height: 26px; text-align: left; color: #414141; font-weight: 400; position: relative;}
#wrap_g .tabs .tab-content .tab .w_detail2 .tab_info li b{font-weight: 500;}
#wrap_g .tabs .tab-content .tab .w_detail2 .tab_info .tab_detail{font-size: 15px; line-height: 26px; text-align: left; color: #616161; font-weight: 400;}
#wrap_g .tabs .tab-content .tab .w_detail2 .tab_info li:first-child:before{content: '\2780';}
#wrap_g .tabs .tab-content .tab .w_detail2 .tab_info li:nth-child(2):before{content: '\2781';}
#wrap_g .tabs .tab-content .tab .w_detail2 .tab_info li:nth-child(3):before{content: '\2782'; }


.txt_copy {padding:3px 0 0 0;}
#contents {padding: 0 0 0 0 !important;}
#contents:after {content:""; display:block; clear:both;}
footer {margin:0 auto !important;}

/* 배송확인 input */

input[type="text"].c_date{display: block;
    width: 60%;
    text-align: left;
    font-size: 13px;
    height: 26px;
    background-color: #fff;
    margin-top: 1px;
    line-height: 26px;
    text-indent: 8px;
    margin-left: -3px;
}

.gift_type .product_badge .pb_type01 {border: 1px solid #4E8ABE; color: #4E8ABE; background: none;}
.gift_type .product_badge .pb_type02 {border: 1px solid #55a28c; color: #55a28c; background: none;}
.gift_type .product_badge .pb_type03 {border: 1px solid #feece1; color: #ee7f48; background: #feece1;}
.gift_type .product_badge .pb_type04 {border: 1px solid #e2eaff; color: #6c89da; background: #e2eaff;}

.gift_more_wrap {margin-top: 100px;}
.gift_more_wrap .more_title {font-size: 25px; color:#000; font-weight: 500; letter-spacing: -0.25px; text-align: center; padding:42px 0; margin-bottom: 30px; font-family: 'Spoqa Han Sans Neo', "Open Sans","Spoqa Han Sans", Apple SD Gothic Neo, Nanum Barun Gothic, Nanum Gothic, "돋움", Dotum, Verdana, Arial, sans-serif;}

.gift_more_wrap .gift_btn {display:table; width: 500px; height: 90px; line-height: 60px; text-align: center; border:1px solid #757575; box-sizing: border-box; letter-spacing: -0.25px; margin:30px auto;}
.gift_more_wrap .gift_btn span {line-height: 88px; font-size: 22px; font-weight: 500; color:#757575; font-family: 'Spoqa Han Sans Neo', "Open Sans","Spoqa Han Sans", Apple SD Gothic Neo, Nanum Barun Gothic, Nanum Gothic, "돋움", Dotum, Verdana, Arial, sans-serif;}
.gift_more_wrap .gift_btn i {position: relative; top:-4px; display: inline-block; width: 15px; height: 9px; background: url(/resources/images/gift/gift_arr_g.png) no-repeat; margin-left: 5px;}
.gift_more_wrap .gift_btn.active i {background: url(/resources/images/gift/gift_arr_ov_g.png) no-repeat;} 

.gift_more_wrap .g_list li {display: none;}

/* 답례품 독려 스타일 */
.gift_type04 {padding-bottom:80px;}
.gift_type04 .product_badge span {display:inline-block; background:#4E8ABE; padding:4px 10px; text-align:center; font-size:13px; color:#fff; border-radius:2px;}
.gift_type04 .product_title {font-size: 18px; font-weight: 400; color: #333; letter-spacing: -0.075em; line-height:26px; text-align: left; margin:14px 0 4px;}
.gift_type04 .product_price {font-size: 16px; font-weight: bold; color:#000;}
.gift_type04 .product_copy {font-size: 14px; color:#888; margin-top: 14px;}
.gift_type04 .g_con {width: 100%; margin: 0;}
.gift_type04 .g_con .g_list {width: 100%;}
.gift_type04 .g_con .g_list li.g_info {width: 288px; height: 560px; padding:0;}
.gift_type04 .g_con .g_list li.g_info .g_img {width: 100%; height: auto;}
.gift_type04 .g_con .g_list li.g_info:not(:nth-child(4n)) {margin-right: 16px;}

/* 개선 리스트 스타일 */
.gift_type02 {padding-bottom:80px;}
.gift_type02 #wrap_g .product_badge span {display:inline-block; background:#4E8ABE; padding:4px 10px; text-align:center; font-size:13px; color:#fff; border-radius:2px;}
.gift_type02 #wrap_g .product_title {font-size: 20px; font-weight: 400; color: #333; letter-spacing: -0.075em; line-height:28px; text-align: left; margin:14px 0 8px;}
.gift_type02 #wrap_g .product_price {font-size: 18px; font-weight: bold; color:#000;}
.gift_type02 #wrap_g .product_copy {font-size: 14px; color:#888; margin-top: 14px;}

/* 개선 상세 스타일 */
.goods_info_wrap.type02 .goods_info_head {height:auto; padding-bottom:16px;}
.goods_info_wrap.type02 h3 {overflow:hidden}
.goods_info_wrap.type02 .g_sub_text {font-size:15px; margin-top:4px;}
.goods_info_wrap.type02 .btn_bx .wrap-card-like{float:left; padding:8px 0 0 0;}
.goods_info_wrap.type02 .btn_bx .wrap-card-like img{width: 34px; height:34px; cursor: pointer;}
.goods_info_wrap.type02 .btn_bx .wrap-card-like em{font-size:15px; float:right; padding:4px 0 0 10px;}

.tabs.new_tabs {}
.tabs.new_tabs .tabs_in {box-sizing:border-box;}
.tabs.new_tabs .tabs_in .tab-links {width:1200px;}
.tabs.new_tabs .tabs_in .tab-links li {width:calc(100%/4); background-color: #f6f6f6; border: 1px solid #e8e8e8; border-bottom: none; margin:0; z-index: 1; box-sizing:border-box;}
.tabs.new_tabs .tabs_in .tab-links li.active {border:1px solid #333; border-bottom:0;}


.tabs.new_tabs .tabs_in .tab-links li:last-child {border-right:1px solid #e8e8e8;}
.tabs.new_tabs .tabs_in .tab-links li.active:last-child {border-right:1px solid #333;}

.tabs.new_tabs .tabs_in.fixed {position:fixed; top:0; border-bottom:1px solid #e8e8e8; z-index:10;}
.tabs.new_tabs .tabs_in.fixed .tab-links li.active {border:0;}
.tabs.new_tabs .tabs_in.fixed .tab-links li.active a { background:#438eb9; color:#fff;}
.tabs.new_tabs .tabs_in.fixed .tab-links li span {border-bottom:0; color:inherit; line-height:30px;}


/* 탭 컨텐츠 */
.w_detail2 {width:1200px !important;}
.tabs.new_tabs .tab-content .cs_tab {padding-bottom:100px;}
.tabs.new_tabs .tab-content .tab:nth-child(1){display:block;}


.tabs.new_tabs .text_wrap {text-align:center; padding-top:40px;}
.tabs.new_tabs .text_wrap .sub_text {font-size:26px; margin-bottom:8px; color:#777;}
.tabs.new_tabs .text_wrap h3 {font-size:34px; color:#3a3a3a; font-weight:bold;}
.tabs.new_tabs .text_wrap .info_text {font-size:18px; line-height:32px; text-align:center; font-weight:300; border-top:1px solid #ddd; padding-top:26px; margin:26px 0 60px; word-break: keep-all;}


.tabs.new_tabs .img_con.img_info img {border-bottom:1px solid #ddd; padding-bottom:32px; margin-bottom:32px;}
.tabs.new_tabs .img_con.img_info img:last-child {border-bottom:0; padding-bottom:0; margin-bottom:0;}

.product_detail_info {text-align:left; margin-top: 15px;}
.product_detail_info .product_title {font-size:22px; font-weight:400; color:#3a3a3a; margin-bottom:10px;}
.product_detail_info .product_sub_text {font-size:16px; line-height:26px; margin-bottom:30px;}

.goods_info_wrap.type02 .btn_rsv.fixed {position:fixed; width:1200px; right:50%; bottom:0; transform:translate(50%); z-index:999;}

.cs_info {text-align:left;}
.cs_info h4 {font-size:22px; font-weight:400; color:#3a3a3a; margin-bottom:20px;}
.cs_info p {font-size:16px; line-height:28px; margin-bottom:8px; word-break:keep-all;}

.cs_tab .btn_wrap {text-align:center; margin-top:80px;}
.cs_tab .btn_cs {display:inline-block; width:350px; height:56px; line-height:56px; background:#454545; border-radius:5px; text-align:center; font-size:18px; color:#fff;}