@charset "utf-8";

/* CSS Document */ 
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css");
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');

:root {
	--white: #ffffff;
	--grey100: #f6f6f6;
	--grey200: #dadada;
	--grey500: #808080;
	--grey700: #535353;
	--grey800: #333333;
	--grey900: #000000;

	--purple100: #f3e4ea;
	--purple400: #a90154;
	--purple500: #a01749;
	--purple600: #95083b;
	--purple700: #780931;
}

/* ==================================================
	공통레이아웃
================================================== */
#header {width:100%;}
#sub{padding-top:191px;}
.size {width:100%; max-width:1280px; padding:0 40px; box-sizing:border-box; height:auto; margin:0 auto;}
.inner  {width:100%; box-sizing:border-box; }
.wrapper {width:100%; position:relative; margin:0 auto; min-height:600px; }
.side_left{float:left;}
.side_right{float:right;}
img {image-rendering: -moz-crisp-edges; image-rendering: -o-crisp-edges; image-rendering: -webkit-optimize-contrast; -ms-interpolation-mode: nearest-neighbor; image-rendering: crisp-edges; }

.swiper{overflow:hidden;}
.swiper-wrapper { display: -webkit-box;}
.swiper-btn{width:60px; height:60px; margin-top:-30px; border-radius:30px; background-color:rgba(195, 195, 195, 0.8); background-repeat:no-repeat; position:absolute; top:50%; z-index:15; cursor:pointer;}
.swiper-btn-prev{background-image:url('/img/arr_left_w.svg'); background-size:19px 27px; background-position:left 46% center; left:-30px;}
.swiper-btn-next{background-image:url('/img/arr_right_w.svg'); background-color:rgba(179, 21, 74, 0.8); background-size:19px 27px; background-position:right 46% center; right:-30px;}
/* ==================================================
	header
================================================== */
header {height: 120px;}
#header{width:100%; background-color:#fff; position:fixed; top:0; left:0; z-index:500;}
#header .link_room{background-color:#f3f3f3; border-bottom:1px solid #dadada; box-sizing:border-box;}
#header .link_room a{display:block; padding:0 15px; float:left; height:39px; line-height:39px;}
#header .link_room .side_left a{border-left:1px solid #dadada;}
#header .link_room .side_left a:first-child{border-left:0;}

#header .link_room .icoop1{width:24px; background-image:url('/coopmall/img/logo/main_home.svg'); background-size:24px; background-position:center top 50%; background-repeat:no-repeat;}
#header .link_room .right_side > a {font-size:15px; font-weight:400; position:relative;}
#header .link_room .right_side > a::before {display:block; content:''; clear:both; width:1px; height:14px; margin-top:-7px; background-color:#222; position:absolute; top:50%; left:-0.5px;}
#header .link_room .right_side > a:first-child::before{display:none;}

#header .main_room {border-bottom:1px solid #dadada; box-sizing:border-box; width: 100%; background-color: #fff;}
#header .main_room > .size {display: flex; align-items: center; justify-content: space-between;}
#header .main_room .logo_box{ height:80px; position:relative;}
#header .main_room .logo_box .logo{display:flex; align-items: center; width:100%; height:79px; line-height:79px; cursor: pointer;}

#header .main_room.commu .logo_box {display: flex;}
#header .main_room.commu .logo_box .logo {width: auto;}
#header .main_room.commu .logo_box span {position: relative;display: inline-flex; align-items: center; padding: 7px 0 0 28px;font-size: 24px;color: #333; font-weight: 500; cursor: pointer;}
#header .main_room.commu .logo_box span:before {content: '';position: absolute; bottom:30%; left: 14px;display: block;width: 1px;height: 28px;background-color: #d6d6d6; }

#header .main_room.shop .logo_box{ height:60px; position:relative;}
#header .main_room.shop .logo_box .logo{display:flex; align-items: center; width:100%; height:59px; line-height:59px; cursor: pointer;}
#header .main_room.shop .logo_box .logo span {position: relative;display: inline-block;padding: 7px 0 0 28px;font-size: 13px;color: #888; font-weight: 400; line-height: 1.2; }
#header .main_room.shop .logo_box .logo span:before {content: '';position: absolute; bottom:30%; left: 14px;display: block;width: 1px;height: 16px;background-color: #d7d7d9; }

#header .my_box a{float:left; display:inline-flex; align-items: center; justify-content: center; height:80px; line-height:79px; padding:0 7px; font-size:1.6rem; color:#535353; font-weight:700; position:relative;}
#header .shop .my_box a {height: 60px; line-height: 59px;}
#header .my_box a.util_shop{margin-left: 7px; padding:0 0 0 10px; width:30px; background-image:url('/coopmall/img/main/icon_cart.svg'); background-size:30px auto; background-position:center; background-repeat:no-repeat; position:relative;}
#header .my_box a.util_shop p{width:18px; height:18px; line-height:18px; margin-top:-18px; padding-right:1px; box-sizing:border-box; border-radius:9px; background:#a01749; color:#fff; text-align:center; font-size:1.4rem; font-weight:700; position:absolute; left:-5%; top:50%;}
#header .my_box a img {vertical-align: middle;}

#header .gnb_room {box-sizing:border-box; background-color: #fff; position: relative;}
#header .gnb_room .txt_nd{width:87px;}
#header .gnb_room .txt_lc{width:109px;}
#header .gnb_room .size{position:relative;}
#header .gnb_room .depth1{display:flex; justify-content:space-between; align-items: center; width: 100%;}
#header .gnb_room .depth1 li{position: relative;}
#header .gnb_room .depth1 > li > a{display:block; padding:14px 40px; height: 80px; line-height:24px; box-sizing:border-box; text-align:center; font-size:1.7rem; font-weight:700; position:relative; transition:none;}
#header .gnb_room .depth1 > li > a#all_flock_show {width: 209px;min-width: 80px; padding: 23px 0; text-align: left; justify-content: flex-start;}
#header .gnb_room .depth1 > li > a#all_flock_show:before {content:''; display: inline-block; width: 17px; height: 14px; margin-right: 10px; background: url('/coopmall/images/r16/main/cate_icon1.png') no-repeat 0 0 / 100%;}
#header .gnb_room .depth1 li.row1 > a{padding:23px 0; width: 5.8vw; min-width: 60px; display: inline-flex; align-items: center; justify-content: center;}
#header .gnb_room .depth1 li.row3 > a {padding:23px 0; width: 7vw; min-width: 140px; display: inline-flex; align-items: center; justify-content: center;}
#header .gnb_room .depth1 li.li7.row1 > a {width:142px;}
#header .gnb_room .depth1 > li.on > a{color:#a01749;}
#header .gnb_room .depth1 > li.on > a::after{display:block; content:''; clear:both; width:100%; height:4px; background:#a01749; position:absolute; bottom:0; left:0%;}
#header .gnb_room .depth1 > li.on > a#all_flock_show:before { background: url('/coopmall/images/r16/main/cate_icon2.png') no-repeat 0 0 / 100%;}
#header .gnb_room .depth1 .row2 {display:none; position: absolute; top:70px; left:-22px; width: 164px; padding:15px; border:1px solid #ddd;border-radius: 0 0 5px 5px; background: #fff; box-shadow: 2px 5px 10px rgba(34,34,34,0.1); font-size:1.5rem; text-align: center; font-weight: 500; line-height: 2; box-sizing: border-box;}
#header .gnb_room .depth1 .row2 a {display: block; position: relative; padding-bottom: 12px; line-height: 1.6; text-align: left;}
#header .gnb_room .depth1 .row2 a:hover {color: #a01749;}
/* #header .gnb_room .depth1 .li3.on a{color:#9a24d8;}
#header .gnb_room .depth1 .li3.on a::after{display:block; content:''; clear:both; width:100%; height:4px; background:#9a24d8; position:absolute; bottom:0; left:0%;} */
#header .gnb_room.shop {border-bottom: 1px solid #dadada}
#header .depth2{display:none; width:100%; height:360px; padding-bottom:30px; background:#f6f6f6; box-sizing:border-box; position:absolute; top:120px; left:0; z-index:530;}
#header .depth2 .case{display:none; justify-content:space-between; flex-wrap:wrap; transition:none;}
#header .depth2 .case.on{display:flex;}
#header .depth2 .case > li{padding:45px 35px; box-sizing:border-box;}
#header .depth2 .case > li.last{width:100%; height:45px; background:#8f8f8f;}
#header .depth2 .case > li strong{display:block; font-size:1.7rem; font-weight:700; line-height:1.27;}
#header .depth2 .case > li > ul{margin-top:8px;}
#header .depth2 .case > li > ul > li > a,
#header .depth2 .case > li > ul > li > b{font-size:1.5rem; line-height:1.4;}
#header .depth2 .case > li > ul > li > a:hover{font-weight:500; color:#000;}
ul#header-campaign-menu { justify-content: left !important; }
ul#header-campaign-menu > li {
	display: flex;
	align-items: center;
	width: 25%;
	height: 200px;
	box-sizing: border-box;
}
#header .depth2 .case4 a{display:block; font-size:0;}
#header .depth2 .case4 a strong span{display:block; line-height:1; margin-top:10px; color:#a01749;}
#header .depth2 .case4 a .word_wrap{margin-top:11px;}
#header .depth2 .case4 a p{font-size:1.5rem; line-height:1.4;}
#header .depth2 .case4 a p.arr_p{display:inline-block; padding-right:22px; background-image:url('/coopmall/img/arr_right.svg'); background-size:17px 14px; background-position:right center; background-repeat:no-repeat; margin-top:7px;}
#header .depth2 .case2 > li.last{height:90px; line-height:90px; background:transparent; padding:0; text-align:center; font-size:0;}
#header .depth2 .case2 > li.last a{display:inline-block; margin:0 5px;}

#header .side_bar{height:100vh; border-left:1px solid #dadada; box-sizing:border-box; background-color:#fff; position:absolute; top:117px; right:-105%; z-index:540;}
#header .side_bar .bar_area{border-top:1px solid #dadada;  box-sizing:border-box;}
#header .side_bar .bar_area:first-child{border-top:none;}
#header .side_size{width:430px; padding:0 40px; box-sizing:border-box;}
#header .side_inner{padding:16px 0;}
#header .side_inner.st1{padding:36px 0;}
#header .side_bar .tit_area{font-size:2.2rem; height:74px; line-height:70px; border-bottom:4px solid #a01749; box-sizing:border-box; text-align:center;}
#header .side_bar .sns_area ul{margin-top:-21px;}
#header .side_bar .sns_area ul li{float:left; width:50%; margin-top:21px;}
#header .side_bar .sns_area ul li a{display:block; position:relative;}
#header .side_bar .sns_area .img_box{width:44px; height:44px; background-repeat:no-repeat; background-position:center; position:absolute; top:50%; left:0; margin-top:-22px;}
#header .side_bar .sns_area .img_box.youtube{background-image:url('/coopmall/img/ico_youtube.png'); background-size:43px 34px;}
#header .side_bar .sns_area .img_box.facebook{background-image:url('/coopmall/img/ico_facebook.svg'); background-size:44px 43px;}
#header .side_bar .sns_area .img_box.kakao{background-image:url('/coopmall/img/ico_kakao.png'); background-size:44px 43px;}
#header .side_bar .sns_area .img_box.instagram{background-image:url('/coopmall/img/ico_instagram.svg'); background-size:45px 46px;}
#header .side_bar .sns_area .txt_box{padding-left:54px; box-sizing:border-box;}
#header .side_bar .sns_area .txt_box p{font-size:1.5rem; line-height:16px; padding:5.5px 0;}
#header .side_bar .link_area ul li a{display:block; font-size:1.5rem; line-height:30px;}

#header .shop_bar{display:none; width:100%; position:absolute; top:171px; left:0; z-index:535;}
#header .shop_bar .shop_inner{max-width:1200px; width:100%; background:#fff; border:1px solid #ddd; margin:0 auto; box-sizing:border-box;}
#header .shop_bar .top_banner a{display:block;}
#header .shop_bar .swiper{position:relative;}
#header .shop_bar .swiper-pagination-bullet{width:10px; height:10px; border-radius:5px; background:#9d9d9d; margin:0 3.5px;}
#header .shop_bar .swiper-pagination-bullet-active{background:#a01749;}
#header .shop_bar .btm_area > div{float:left;}
#header .shop_bar .btm_area .menu_wrap{width:43.33%;}
#header .shop_bar .menu{float:left; width:50%; height:510px; padding:6px 0; box-sizing:border-box;}
#header .shop_bar .menu1{overflow-y:scroll;}
#header .shop_bar .menu1 ul li a{display:flex; align-items: center; font-weight:700; font-size:1.5rem; line-height:22px; padding:6px 20px 6px 30px; box-sizing:border-box; transition:none;}
#header .shop_bar .menu1 ul li a:hover{background:#f3f3f3; color:#a01749;}
#header .shop_bar .menu1 ul li a img {padding-right: 5px;}
#header .shop_bar .menu1 ul li.on a{background:#f3f3f3; color:#a01749;}
#header .shop_bar .menu2{background:#f3f3f3;}
#header .shop_bar .menu2 ul{display:none;}
#header .shop_bar .menu2 ul.on{display:block;}
#header .shop_bar .menu2 ul li a{display:block; font-size:1.5rem; line-height:22px; padding:6px 35px; font-weight:400; box-sizing:border-box;}
#header .shop_bar .menu2 ul li a:hover{color:#a01749; font-weight:700;}
#header .shop_bar .btm_area .cont_wrap{width:56.67%;}
#header .shop_bar .top_box{padding:15px 32px; box-sizing:border-box;}
#header .shop_bar .top_box ul{width:102.92%; margin-left:-2.92%;}
#header .shop_bar .top_box ul li{float:left; width:17.08%; margin-left:2.92%;}
#header .shop_bar .top_box ul li a{display:block; height:40px; line-height:38px; border:1px solid #ddd; border-radius:20px; text-align:center; font-weight:700; font-size:1.8rem; transition:all .2s ease;}
#header .shop_bar .top_box ul li a:hover{background:#a01749; border-color:#a01749; color:#fff;}
#header .shop_bar .btm_box{border-top:1px solid #ddd; padding:32px 32px 0; box-sizing:border-box;}
#header .shop_bar .btm_box strong{display:block; line-height:1; font-size:1.8rem; font-weight:700;}
#header .shop_bar .btm_box strong img{width:83px; height:17px; margin-top:-5px;}
#header .shop_bar .btm_box .medal_list{margin-top:18px;}
#header .shop_bar .btm_box .medal_list ul{font-size:0; margin-top:-18px;}
#header .shop_bar .btm_box .medal_list ul li{display:inline-block; max-width:120px; width:20%; margin-top:18px;}
#header .shop_bar .btm_box .medal_list ul li a{display:block; text-align:center; height:102px;}
@media screen and (max-width:1200px) {
	#header .main_room .side_left {display: none;}
}
#header #main-search {position: relative; display: inline-block;}
#header #main-search #search_key_id {border: 2px solid #a01749; border-radius: 80px; width: 480px; height: 44px; padding: 9px 30px; font-size: 16px; box-sizing: border-box;}
#header #main-search #search_key_id::placeholder {color: #787878;}
#header #main-search #main-search-btn {position: absolute; top: 50%; transform: translateY(-50%); right: 30px; filter: invert(15%) sepia(63%) saturate(3134%) hue-rotate(319deg) brightness(101%) contrast(99%);}
#header .community_room { background-color: #fff; position: relative; top: -1px; border-bottom: 1px solid #dadada;}
#header .community_room .size {justify-content: space-around; font-size: 18px; font-weight: 500; color: #333; padding: 7px 40px;}
#header .community_room .size li {cursor: pointer;}
#header .community_room .size li:hover { color: #a01749;}
#header .community_room .size .on {font-weight: 700; color: #a01749;}
/* ==================================================
	footer
================================================== */
footer { border-top: 1px solid #c8c8c8;}
footer a, footer p { color: #4d4d4d!important;}
footer #footer-top { background-color: #f7f7f7;}
footer #footer-util { gap: 42px;}
footer #footer-sns { gap: 8px; }
footer #footer-sns img { width: 32px;}
footer #site-map { width: 172px; height: 36px; line-height: 36px; margin-left: 15px; border: 1px solid #d6d6d6; font-size: 15px; color: #4d4d4d; text-align: center;}
footer li {line-height: 1;}
/* ==================================================
	검색창
================================================== */
.search-box {display:inline-block; position:absolute; top:9px; left:50%; transform:translateX(-50%);}
.search-box #search_goods {position: relative;}
.search-box #search_key_id {width: 260px;padding: 5px 50px 5px 20px;border: 1px solid #a01749;border-radius: 20px; font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif; font-size: 1.5rem;line-height: 2;box-sizing: border-box;outline: 0; margin-left: -150px;letter-spacing: -1px;}
.search-box #search_key_id:focus-visible {outline: 0;}
.search-box #main-search-btn {position: absolute;top: -4px;right: 15px;width: 27px;}


#recommend_contents, .ui-autocomplete {width: 480px;border: 1px solid #eee;border-radius: 20px;position: absolute;z-index: 900; font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif; font-size: 15px;background-color: white;display: none;box-shadow: 1px 2px 10px rgba(34,34,34,0.1);}
#recommend_contents .schTit {height: 45px;line-height: 45px;border: 0;color: #858585;}
#recommend_contents .schCont {float: none;width: 100%;min-height: 200px;padding: 10px 0 50px;border: 0;}
#recommend_contents .schCont .pointer {display: flex;justify-content: space-between;align-items: center;padding: 5px 15px;color: #858585; font-size: 15px;}
#recommend_contents #m-search-rec-recent-btn {display: inline-block;width: auto;min-width: 150px;height: auto;line-height: 1.4;padding: 5px 10px;bottom: 12px;left: 50%;transform: translateX(-50%);border: 1px solid #ddd;}#recommend_contents #m-search-rec-recent-btn2 {bottom: 5px;}

.ui-autocomplete {max-width: 260px; padding: 10px 0!important;}
.ui-autocomplete .ui-menu-item {display: flex;justify-content: space-between;align-items: center;padding: 5px 15px;color: #858585; font-size: 15px;}
.ui-autocomplete .ui-menu-item.ui-state-focus {background: none; margin: 0; font-weight: 600; color: #a01749; border: 0;}

.search-recent-date {margin: 0 5px;font-size: 0.9em;color: #999999;}

#contents-d3 {height: 100%;position: relative;min-height: 200px;}

#TabsOpenArea {display: flex;}
#TabsOpenArea li {width: 50%;cursor: pointer;border-bottom: 2px solid #ddd;}
#TabsOpenArea .on {border-bottom: 2px solid #a01749;}
#TabsOpenArea .on .schTit {color: #353535;}

.search_tab_area {display: none;}
.search_tab_area.on {display: block;}
@media screen and (max-width:1200px) {
	.search-box {top:10px; left:20px; transform: none;}
}

.antiC-list {display:inline-block; position:absolute; top: 58px; left: 66.6%; color:#fff; z-index: 1; }
.antiC-btn { font-size:17px; background-color:#a01749; padding:4px 6px; border-radius:5px; color:#fff!important;}
.antiC-btn:hover, .antiC-btn:link {color:#fff!important;}
.antiC-list ul {display: none; color: #333; border: 1px solid #eee; box-shadow: 1px 2px 10px rgba(34,34,34,0.1); background-color: #fff; margin-top: -1px; padding: 10px; border-radius: 5px; font-size: 17px;}
.antiC-list ul li {padding-bottom: 4px;}

/* ==================================================
	skip
================================================== */
a.skip{display:block;position:absolute;top:-1px;z-index:999;width:0;height:0;overflow:hidden;text-align:center}
a.skip:active,a.skip:focus{z-index:999;width:100%;height:auto;padding:5px;background:#FFF}

a:hover{transition:all .2s ease; -webkit-transition:all .2s ease; -ms-transition:all .2s ease; -moz-transition:all .2s ease; -o-transition:all .2s ease;}


input[type=button] {cursor:pointer !important;}
.bt{cursor:pointer !important;}

.nodata-wrap {text-align: center; margin: 40px auto 60px;}
.nodata {font-size: 1.6rem;color: #858585;}
.txt_warning {color: #C6002F; font-size: 15px;}
.txt_notice {color: #0077E4!important; font-size: 15px;}


/* 공통 tooltip style */
.tooltipCommon {position:relative;display:inline-block;}
.tooltipCommon .lyTooltip {display:none;position:absolute;top:0;right:0;z-index:10;padding: 20px;border: 1px solid #333;background-color:#fff;}
.tooltipCommon.active .lyTooltip {display:block;}
.tooltipCommon .lyTooltip .tooltipTit {display:block;line-height:1.6;margin-bottom:10px;color:#000;font-size:1.8rem;}
.tooltipCommon .lyTooltip .btnClose {position:absolute;top:6px;right:6px;z-index:5;width: 28px;height: 28px;background:url('/coopmall/images/r16/main/all_flock_close.jpg') no-repeat 50% 50%;border: 0;cursor:pointer;}
/* 공유 버튼 */
.tooltipCommon.typeShare {position: absolute;top:0;right:0;}
.tooltipCommon.typeShare .icoShare {position:absolute;top:0;right:0;width:28px;height:28px;border: 0;background: url('/coopmall/images/gooddetail/share.png') no-repeat center / 100%;cursor: pointer;}
.tooltipCommon.typeShare .lyTooltip {top:40px;width:240px;box-sizing:border-box;}
.tooltipCommon .lyTooltip .inBody .snsLinkBox {margin-top:8px;text-align: center;}
.tooltipCommon .lyTooltip .inBody .snsLink {display:flex; justify-content: space-around;}
.tooltipCommon .lyTooltip .inBody .snsLink a {display:flex; flex-direction:column; align-items:center;}
.tooltipCommon .lyTooltip .inBody .snsLink a img {width:32px;}
.tooltipCommon .lyTooltip .inBody .snsLink a .txt {display:block; margin-top:5px; color:#888; font-size:13px;}

.input-st01 {position: relative;width: 120px;height: 32px; font-size: 1.5rem; padding: 0 30px 0 12px; font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif; color: #666; border: 1px solid #ddd;background-color: #fff; outline: 0; box-sizing: border-box;}

/* 셀렉트박스 */
.select{display:inline-block;  position:relative; height:40px; width:100%; vertical-align: middle;}
.select select{display: block; cursor: pointer;  max-width:100%;  -moz-appearance:none; /* Firefox */   -webkit-appearance:none; /* Safari and Chrome */  appearance:none;}
select::-ms-expand { display:none; } 
.select select:not([multiple]){ right:5px;}
.select:not(.is-multiple):not(.is-loading)::after{border: 2px solid #333; border-radius: 2px; border-right: 0; border-top: 0; content: ' '; display: block; height: 6px; margin-top: -6px; pointer-events: none; position: absolute; top: 50%; transform: rotate(-45deg); transform-origin: center; width: 6px; right:10px; z-index: 4;}

.select-st01 {position: relative;width: 120px;height: 32px; font-size: 1.5rem; margin-top: 10px; padding: 0 30px 0 12px; font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif; color: #666; border: 1px solid #ddd; appearance: none; background: none; background-repeat: no-repeat; background-image: url(/coopmall/images/r16/main/family_arrow.jpg); background-position: 94% center; background-size: 15px; background-color: #fff; outline: 0; box-sizing: border-box;}

/* 체크박스 */
.check_box { position:relative;}
.check_box input[type="checkbox"]{display:inline-block; position:absolute; left:-9999px; opacity:0; visibility:hidden; width:1px; height:1px; filter:alpha(opacity=0); -ms-filter:alpha(opacity=0); overflow:hidden; }
.check_box label {display:inline-block; padding-left:30px; color:#333; cursor:pointer; position:relative; line-height:24px;}
.check_box label:before  {position:absolute; left:0; top:50%; width:24px; height:24px; box-sizing:border-box; margin-top:-12px; border:1px solid #cccccc; line-height:20px; text-align:center; clear:both; content:''; display:block;}
.check_box input[type="checkbox"]:checked + label:before {content:'\2714'; font-size:18px; font-weight: 500;}

/* 라디오버튼 */
.radio_box { position:relative;}
.radio_box input[type="radio"]{display:inline-block; position:absolute; left:-9999px; opacity:0; visibility:hidden; width:1px; height:1px; filter:alpha(opacity=0); -ms-filter:alpha(opacity=0); overflow:hidden; }
.radio_box label {display:inline-block; padding-left:30px; color:#333; cursor:pointer; position:relative; line-height:24px;}
.radio_box label:before  {position:absolute; left:0; top:50%; width:24px; height:24px; box-sizing:border-box; border-radius: 12px; margin-top:-12px; border:1px solid #cccccc; line-height:20px; text-align:center; clear:both; content:''; display:block;}
.radio_box label:after{position:absolute; content:'\2022'; font-size:30px; left:6px; top:0; line-height: 16px; font-weight: 500; display:none;}
.radio_box input[type="radio"]:checked + label:after {display:block;}

/* input type="file"*/
.fileBox{position:relative;}
.fileBox .inputBox{float:left; box-sizing: border-box;}
.fileBox input[type="text"]{float:left;overflow:hidden;box-sizing:border-box;height:32px;padding:8px 10px;border:1px solid #cccccc;line-height:1;background:#fafafa;  box-sizing: border-box;}
.fileBox .fileBtn{float:left;margin-left:5px;  box-sizing: border-box;}
.fileBox .fileBtn label{display:inline-block;width:110px;font-size:14px;line-height:40px; height:40px; letter-spacing:-1px;color:#fff;background:#999;text-align:center; border-radius: 4px;  box-sizing: border-box;}
.fileBox .fileBtn input[type="file"]{visibility:hidden;width:0;height:0;padding:0;margin:0;}

/* textarea */
.textarea {width: 100%; padding: 16px; border: 1px solid #ccc; border-radius: 5px; max-height: 400px; overflow-y: auto; box-sizing: border-box; white-space: pre-line;}
.textarea::-webkit-scrollbar {width: 8px;}
.textarea::-webkit-scrollbar-thumb {width: 8px; background-color: #ddd; border-radius: 10px;}

.keepText {word-wrap: normal; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.multiLine2 {display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; -moz-line-clamp:2; -moz-box-orient: vertical; -ms-line-clamp: 2; -ms-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; white-space: unset;}
.multiLine3 {display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; -moz-line-clamp:3; -moz-box-orient: vertical; -mx-line-clamp:3; -ms-box-orient:vertical; overflow: hidden; white-space: unset; text-overflow: ellipsis;}
.multiLine4 {display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; -moz-line-clamp:4; -moz-box-orient: vertical; -mx-line-clamp:4; -ms-box-orient:vertical; overflow: hidden; white-space: unset; text-overflow: ellipsis;}

.btn-st01 {  font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;  border: 1px solid #ccc; color:#777; padding: 8px 10px; background-color: #fff; border-radius: 5px; }
.btn-st01.sig {background-color: #a01749; color: #fff; border: 1px solid #a01749;}
.btn-st01.gray {background-color: #ccc; color: #000;}
.btn-st02 {  font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;  border: 0; color:#fff; padding: 8px 10px; background-color: #1c8a2a; border-radius: 5px; font-size: 2rem; margin: 0; }
.btn-st03 {  font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;  border: 0; color:#fff; padding: 8px 10px; background-color: #acacac; border-radius: 5px; font-size: 2rem; margin: 0; float:right; cursor: pointer; }
.btn-st04 {  font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;  border: 1px solid #ccc; color:#777; padding: 8px 10px; background-color: #fff; border-radius: 5px; }
.btn-st04.sig {background-color: #a01749; color: #fff; border: 1px solid #a01749;}
.btn-st04.gray {background-color: #ccc; color: #000;}
.gc_comment_btn{ border:1px solid #ff4c65; display:inline-block; height:40px; background-color:#ff4c65; border-radius:3px; cursor:pointer; color:white; text-align:center; line-height:40px; font-weight:600; font-size:14pt; padding-right:5px; padding-left:5px; margin-bottom:10px; font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif; }

/* 공통 카트모달창 */
#cart_modal-container {display:none;position:fixed; width: 100%; height: 100%; top:0px; left:0px; z-index: 99; }
#cart_modal-wrap {display:flex; align-items: center; flex-direction: column;min-height:100%; background-color:rgba(0, 0, 0, 0.57);}
#cart_modal-backcvr {position:fixed; width: 100%; min-height:100%;z-index:10;}
#cart_modal-content {width: 400px; margin:auto; background-color:#FFFFFF;border-radius:10px;  color:#414141; z-index: 11;}
#cart_modal-content-top { display: flex; align-items: center;height: 40px; line-height: 40px;padding: 10px;background-color:#EFEFEF;border-radius: 10px 10px 0 0px;font-size: 13pt; }
#cart_modal-content-top img {margin-right:10px; height:22px;}
#cart_modal-content-wrapper {padding-bottom: 20px;}
#cart_modal-content-main {width: 100%;margin: auto;}
#modal-data-gname {width: 90%; height: 50px; line-height:50px; margin:auto; font-weight:bold; text-align:center;font-size: 1.8rem;}
#modal-content-info {margin:0 auto 20px; padding:20px;border-top: 1px solid #E6E6E6; border-bottom: 1px solid #E6E6E6;}
#modal-content-info p {line-height: 30px;font-size: 1.7rem;}
#modal-content-info span {font-size: 1.7rem;}
#modal-content-info #tomorrow_price span:first-child {color:#049EA0;}
#modal-content-ordering {width: 85%; min-height:75px;margin:auto}
#modal-content-ordering .quantity-wrap {display:flex; align-items:center; justify-content:center;}
#modal-content-ordering .quantity img {width:37px; height:37px; margin:0 8px;}
#modal-content-ordering .quantity_num input{width: 37px;height:37px;border:1px solid rgb(204,204,204);text-align:center; font-weight:bold;}
#modal-content-ordering #modal-content-totalprice {margin: 0 20px 0 10px;}
#modal-content-ordering span {font-size: 1.8rem;}
#btn_bookmark {width: 37px; height: 37px; line-height: 30px; margin: 1px; text-align:center; vertical-align:middle; background:url('/mobile/img/bmark.jpg') no-repeat; background-size: 37px 37px; }
.modal-btn-wrap {display: flex;align-items: center;justify-content: center;width: 85%; margin:auto; text-align:right;line-height:250px;}
.cart_add_btn {width: 140px;min-height: 41px; line-height: 41px; text-align:center;border-radius: 5px;color: #fff;font-weight: bold;font-size:14px; cursor: pointer; }
.cart_add_btn#normal-cart-btn {background-color:#EC5A69; }
.cart_add_btn#modal-content-subscribe {margin: 0 5px; padding: 0 10px;  background-color:#3284d9;}
.lifecare-order {display: flex;align-items: center;justify-content: center;width:100%;padding-top:10px;}
.lifecare-order .cart_add_btn {background-color: #5c0f8b;}
.pointColor {color: #EC5A69;}

@media screen and (max-width:720px) {
	#cart_modal-content {width:300px;}
	#modal-content-info p {font-size: 17px;}
	#modal-content-info span {font-size:17px;}
	#modal-content-ordering > div {flex-direction: column;}
	#modal-content-ordering span {font-size: 18px;}
	#modal-content-ordering #modal-content-totalprice {margin: 20px 0; text-align: center;}
}

/* 공통 알림창 */
.Pstyle-overlay {position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 9999; display: none;}
.Pstyle-overlay.dark {background-color: rgba(0, 0, 0, 0.5);}
.Pstyle-position {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.Pstyle-alert {background-color: #fff;border-radius: 10px;max-height: 90vh;width: 420px;min-height: 200px;padding: 30px; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.16)}
.Pstyle-alert .popheader {text-align: center;color: #a01749;font-size: 20px;font-weight: 500;margin-bottom: 30px;position: relative;}
.Pstyle-alert .b-close {position: absolute; right:25px; cursor: pointer;}
.Pstyle-close {position: absolute; top: 20px; right:20px; width: 15px; height: 15px; background: url("https://www.icoop.or.kr/mobile/img/btn_close_new.png") no-repeat center center; background-size: 100% 100%;}
.Pstyle-alert .popcontent {text-align: center;}
.Pstyle-alert .poptext {text-align: center;margin: 10px auto 40px;font-size: 16px;line-height: 2;}
body.scroll_prevent {overflow: hidden!important;}

/* ==================== [ common ] ==================== */
/* width & height */
.wid10	{ width: 10%; }
.wid20	{ width: 20%; }
.wid30	{ width: 30%; }
.wid40	{ width: 40%; }
.wid50	{ width: 50%; }
.wid60	{ width: 60%; }
.wid70	{ width: 70%; }
.wid80	{ width: 80%; }
.wid90	{ width: 90%; }
.wid100	{ width: 100%; }

.w200 { width: 200px; }
.w400 { width: 400px; }
.w650 { width: 650px; }
.w800 { width: 800px; }
.w900 { width: 900px; }
.w1100 { width: 1100px; }
.w1200 { width: 1200px; }
.w1300 { width: 1300px; }

.max100	{ max-width: 100px; }
.max150	{ max-width: 150px; }
.max200	{ max-width: 200px; }
.max250	{ max-width: 250px; }
.max300	{ max-width: 300px; }
.max350	{ max-width: 350px; }
.max400	{ max-width: 400px; }
.max450	{ max-width: 450px; }
.max500	{ max-width: 500px; }
.max550	{ max-width: 550px; }
.max600	{ max-width: 600px; }
.max650	{ max-width: 650px; }
.max700	{ max-width: 700px; }
.max750	{ max-width: 750px; }
.max800	{ max-width: 800px; }
.max850	{ max-width: 850px; }
.max900	{ max-width: 900px; }
.max950	{ max-width: 950px; }
.max1000{ max-width: 1000px; }

.h80 { height: 80px; }

.mh55 { min-height: 55px; }
.full_height { height: 100% !important; }

/* col width */
.col02 > * { width: 50% !important; }
.col03 > * { width: 33.3333% !important; }
.col04 > * { width: 25% !important; }
.col05 > * { width: 20% !important; }
.col06 > * { width: 16.6666% !important; }
.col07 > * { width: 14.285% !important; }
.col08 > * { width: 12.5% !important; }
.col09 > * { width: 11.1111% !important; }
.col10 > * { width: 10% !important; }

.col-1 > .item { width: 100%; }
.col-2 > .item { width: 50%; }
.col-3 > .item { width: 33.33%; }
.col-4 > .item { width: 25%; }

/* margin */
.mg-none { margin: 0; }
.mg-auto { margin: auto; }
.mx-auto { margin-right: auto; margin-left: auto; }

.my-5 { margin-top: 5px; margin-bottom: 5px; }
.my-10 { margin-top: 10px; margin-bottom: 10px; }
.my-15 { margin-top: 15px; margin-bottom: 15px; }
.my-20 { margin-top: 20px; margin-bottom: 20px; }
.my-30 { margin-top: 30px; margin-bottom: 30px; }
.my-40 { margin-top: 40px; margin-bottom: 40px; }
.my-60 { margin-top: 60px; margin-bottom: 60px; }
.my-90 { margin-top: 90px; margin-bottom: 90px; }
.my-100 { margin-top: 100px; margin-bottom: 100px; }
.my-150 { margin-top: 150px; margin-bottom: 150px; }

.mt0 	{ margin-top: 0px !important; }
.mt10	{ margin-top: 10px !important; }
.mt20	{ margin-top: 20px !important; }
.mt30	{ margin-top: 30px !important; }
.mt40	{ margin-top: 40px !important; }
.mt50	{ margin-top: 50px !important; }
.mt60	{ margin-top: 60px !important; }
.mt70	{ margin-top: 70px !important; }
.mt80	{ margin-top: 80px !important; }
.mt90	{ margin-top: 90px !important; }
.mt100	{ margin-top: 100px !important;}

.mb0	{ margin-bottom: 0px !important; }
.mb10	{ margin-bottom: 10px !important; }
.mb20	{ margin-bottom: 20px !important; }
.mb30	{ margin-bottom: 30px !important; }
.mb40	{ margin-bottom: 40px !important; }
.mb50	{ margin-bottom: 50px !important; }
.mb60	{ margin-bottom: 60px !important; }
.mb70	{ margin-bottom: 70px !important; }
.mb80	{ margin-bottom: 80px !important; }
.mb90	{ margin-bottom: 90px !important; }
.mb100	{ margin-bottom: 100px !important; }

.ml0	{ margin-left: 0px !important; }
.ml10	{ margin-left: 10px !important; }
.ml20	{ margin-left: 20px !important; }
.ml30	{ margin-left: 30px !important; }
.ml40	{ margin-left: 40px !important; }
.ml50	{ margin-left: 50px !important; }

.mr0	{ margin-right: 0px !important; }
.mr10	{ margin-right: 10px !important; }
.mr20	{ margin-right: 20px !important; }
.mr30	{ margin-right: 30px !important; }
.mr40	{ margin-right: 40px !important; }
.mr50	{ margin-right: 50px !important; }

/* padding */
.pd10 { padding: 10px; }
.pd20 { padding: 20px; }
.pd30 { padding: 30px; }
.pd40 { padding: 40px; }

.px-20 { padding-right: 20px; padding-left: 20px; }

.py-10 { padding-top: 10px; padding-bottom: 10px; }
.py-35 { padding-top: 35px; padding-bottom: 35px; }
.py-60 { padding-top: 60px; padding-bottom: 60px; }

.pt10 { padding-top: 10px !important; }
.pt20 { padding-top: 20px !important; }
.pt30 { padding-top: 30px !important; }
.pt40 { padding-top: 40px !important; }
.pt50 { padding-top: 50px !important; }
.pt60 { padding-top: 60px !important; }
.pt70 { padding-top: 70px !important; }

.pb10 { padding-bottom: 10px !important; }
.pb20 { padding-bottom: 20px !important; }
.pb30 { padding-bottom: 30px !important; }
.pb40 { padding-bottom: 40px !important; }
.pb50 { padding-bottom: 50px !important; }
.pb60 { padding-bottom: 60px !important; }
.pb70 { padding-bottom: 70px !important; }


.auto {margin-left:auto !important; margin-right:auto !important;}
.bno{border:none !important;}
.blind{position:absolute; top:-999999px; width:0; height:0; font-size:0; overflow:hidden;}
.clear:after {clear:both;content:'';display:block;}
.hidden {text-indent:-9999px; width:0px; height:0px; line-height:0px; font-size:0px; opacity:0; filter:alpha(opacity=0); -ms-filter:alpha(opacity=0); overflow:hidden; visibility:hidden;}
.dpb{display:block !important;}
.inb{display:inline-block !important;}

.fl_l{float:left !important;}
.fl_r{float:right !important;}

/* ==================== [ layout ] ==================== */
/* basic & aligns */
.bPopup-content {
	display: none;
	z-index: 99;
	background: white;
}
.block	{ display: block; }
.flex	{ display: flex; }
.grid	{ display: grid; }

.flex-grow1	{ flex-grow: 1; }

.item_full{width:100%; height:100%;}
.item_middle{-webkit-box-pack: justify; -moz-justify-content: center;  -ms-flex-pack: justify; justify-content: center; -webkit-box-align: center; -moz-box-align: center; -ms-flex-align:center; -webkit-align-items: center; align-items:center;}
.item_shrink{flex-shrink:0;}

.gap5	{ gap: 5px; }
.gap10	{ gap: 10px; }
.gap15	{ gap: 15px; }
.gap20	{ gap: 20px; }
.gap30	{ gap: 30px; }
.gap37	{ gap: 37px; }
.gap40	{ gap: 40px; }
.gap50	{ gap: 50px; }
.gap60	{ gap: 60px; }
.gap70	{ gap: 70px; }
.gap80	{ gap: 80px; }

.flx_ctr_txt{display: -webkit-box; display: -moz-box;  display: -ms-flexbox;  display: flex; -webkit-box-pack: justify; -moz-justify-content: center;  -ms-flex-pack: justify; justify-content: center; -webkit-box-align: center; -moz-box-align: center; -ms-flex-align:center; -webkit-align-items: center; align-items:center; -webkit-box-align: center; -moz-box-align: center; -ms-flex-align:center; -webkit-align-items: center; align-items:center; text-align:center;}
.flx_ctr_txt > p{font-size:inherit; color:inherit; font-weight:inherit;}

.justify_between, .justify-between { -webkit-box-pack: justify; -moz-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; }
.justify_center, .justify-center { -webkit-box-pack: justify; -moz-justify-content: center;  -ms-flex-pack: justify; justify-content: center;}
.justify_start { -webkit-box-pack: justify; -moz-justify-content: flex-start;  -ms-flex-pack: justify;  justify-content: flex-start;}
.justify_end {  -webkit-box-pack: justify; -moz-justify-content: flex-end;  -ms-flex-pack: justify;  justify-content: flex-end}

.align_center, .align-center, .items-center{ -webkit-box-align: center; -moz-box-align: center; -ms-flex-align:center; -webkit-align-items: center; align-items:center;}
.align_end{ -webkit-box-align: end; -moz-box-align: end; -ms-flex-align:end; -webkit-align-items: end; align-items:end;}
.align_stretch{-webkit-box-align: stretch; -moz-box-align: stretch; -ms-flex-align:stretch; -webkit-align-items: stretch; align-items:stretch;}

.flex_box.start, .fBox.align_start { -webkit-box-align: start;  -moz-align-items: start; -ms-flex-align: start; align-items: start ;}
.flex_box.end { -webkit-box-align: end;  -moz-align-items: end; -ms-flex-align: end; align-items: end ;}

.fBox.start { -webkit-box-pack: start;  -moz-justify-content: start;   -ms-flex-pack: start; justify-content: start; }
.fBox.end { -webkit-box-pack: end;  -moz-justify-content: end;   -ms-flex-pack: end; justify-content: end; }



/* flex */
.flex-col { flex-direction: column;}
.flex-nowrap	{flex-wrap: nowrap;}
.flex-wrap		{flex-wrap: wrap;}

.flex_row { -webkit-box-orient: horizontal; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; }
.flex_col { -webkit-box-orient: vertical;  -moz-flex-direction: column;  -ms-flex-direction: column;  flex-direction: column; }
.direction_column{-webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; -o-flex-direction: column; -webkit-box-orient: vertical; flex-direction: column;}

.flex_row_re { -webkit-box-orient: horizontal;  -webkit-box-direction: reverse;  -moz-flex-direction: row-reverse;  -ms-flex-direction: row-reverse;  flex-direction: row-reverse; }
.flex_col_re { -webkit-box-orient: vertical;  -webkit-box-direction: reverse;  -moz-flex-direction: column-reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse;}

.flex_wrap {    -webkit-box-lines: multiple;  -moz-flex-wrap: wrap; -ms-flex-wrap: wrap;  flex-wrap: wrap; }
.flex_box.wrap  {-webkit-box-lines: multiple; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap;  flex-wrap: wrap; } 

/* grid */
.grid.col2-auto { grid-template-columns: auto auto; }



.move {transition:all .4s ease; -webkit-transition:all .4s ease; -ms-transition:all .4s ease; -moz-transition:all .4s ease; -o-transition:all .4s ease; }

.t_rw{overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; word-break:break-all; word-wrap:break-word;}
.bg_cv{background-size:cover; background-position:center; background-repeat:no-repeat;}
.bg_cv > img{width:100%; opacity:0; visibility:hidden;}
.bg_ic{background-repeat:no-repeat;}

/* 줄 제한 스타일 */
.t_rw{overflow:hidden; text-overflow:ellipsis; -o-text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; -moz-box-orient:vertical; word-break:break-all; word-wrap:break-word;}
.rw1{-webkit-line-clamp:1;}
.rw2{-webkit-line-clamp:2;}
.rw3{-webkit-line-clamp:3;}

/* 요소 같은 위치에 숨기기 */
.ct_out{width:1px; height:1px; margin:-1px; position:absolute; clip: rect(0, 0, 0, 0); overflow:hidden;}

/* 요소 내에 텍스트 제거(빈 태그 없게하기 위해) */
.ct_zero{font-size:0; text-indent:-9999px;}

/* 요소 스크롤 없애기(숨김처리) */
.sc_out {-ms-overflow-style: none; scrollbar-width: none;}
.sc_out::-webkit-scrollbar {display: none;}

/* 이미지 태그 */
.obj_fit{display:block; width:100%; height:100%; object-fit:cover; object-position:center;}

/* clear */
.clear:after{display:block; content:''; clear:both;}


.wbreak{word-break:break-all !important;}

table {margin:0 auto;}

.tb {display:table;width:100%; height:100%}
.tbc {display:table-cell;width:100%; height:100%; vertical-align:middle; }
.img img{max-width:100%}
.pic {background-size: contain;background-position: center center;background-repeat: no-repeat;}
.pic img{max-width: 100%;opacity: 0;visibility: hidden;}

.back_img{background-repeat: no-repeat; background-size:cover; background-position:50% 50%;}
.basic_img{opacity:0; visibility:hidden; filter:alpha(opacity=0); -ms-filter:alpha(opacity=0);}

/* Font */
.ft12 { font-size: 12px !important; }
.ft13 { font-size: 13px !important; }
.ft14 { font-size: 14px !important; }
.ft15 { font-size: 15px !important; }
.ft16 { font-size: 16px !important; }
.ft17 { font-size: 17px !important; }
.ft18 { font-size: 18px !important; }
.ft19 { font-size: 19px !important; }
.ft20 { font-size: 20px !important; }
.ft21 { font-size: 21px !important; }
.ft22 { font-size: 22px !important; }
.ft23 { font-size: 23px !important; }
.ft24 { font-size: 24px !important; }
.ft25 { font-size: 25px !important; }
.ft26 { font-size: 26px !important; }
.ft27 { font-size: 27px !important; }
.ft28 { font-size: 28px !important; }
.ft29 { font-size: 29px !important; }
.ft30 { font-size: 30px !important; }
.ft31 { font-size: 31px !important; }
.ft32 { font-size: 32px !important; }
.ft48 { font-size: 48px !important; }
.ft65 { font-size: 65px !important; letter-spacing:-4px; line-height:60px; }

.fs80 { font-size: 8rem; }
.fs70 { font-size: 7rem; }
.fs60 { font-size: 6rem; }
.fs55 { font-size: 5.5rem; }
.fs50 { font-size: 5rem; }
.fs45 { font-size: 4.5rem; }
.fs40 { font-size: 4rem; }
.fs35 { font-size: 3.5rem; }
.fs30 { font-size: 3rem; }
.fs25 { font-size: 2.5rem; }
.fs20 { font-size: 2rem; }
.fs18 { font-size: 1.8rem; }
.fs17 { font-size: 1.7rem; }
.fs16 { font-size: 1.6rem; }
.fs15 { font-size: 1.5rem; }
.fs14 { font-size: 1.4rem; }
.fs13 { font-size: 1.3rem; }
.fs12 { font-size: 1.2rem; }
.fs11 { font-size: 1.1rem; }
.fs10 { font-size: 1rem; }

.txt_l { text-align:left !important; }
.txt_c { text-align:center !important; }
.txt_r { text-align:right !important; }
.ver_t { vertical-align:top !important; }

/* font weight & decoration */
.txt_b { font-weight:bold !important; }
.txt_line { text-decoration:underline !important; }

.txt_black	{ color: #000 !important; }
.txt_white	{ color: #fff !important; }
.txt_rd		{ color: #a01749; }
.txt_gry	{ color: #787878; }

.fw200 {font-weight:200 !important;}
.fw300 {font-weight:300 !important;}
.fw400 {font-weight:400 !important;}
.fw500 {font-weight:500 !important;}
.fw600 {font-weight:600 !important;}
.fw700 {font-weight:700 !important;}
.fw800 {font-weight:800 !important;}

/* word-break */
.break-all { word-break: break-all; }
.keep-all { word-break: keep-all; }



/* animated */
.animate [class*='ani-']{opacity:1; filter:alpha(opacity=100); -ms-filter:alpha(opacity=100); transform:translate3d(0,0,0); -webkit-transform:translate3d(0,0,0); -o-transform:translate3d(0,0,0); -ms-transform:translate3d(0,0,0); -moz-transform:translate3d(0,0,0);}
.fromLeft:not(.done) {opacity:0; filter:alpha(opacity=0); -ms-filter:alpha(opacity=0); transform:translate3d(-50px, 0, 0); -webkit-transform:translate3d(-50px, 0, 0); -o-transform:translate3d(-50px, 0, 0); -ms-transform:translate3d(-50px, 0, 0);  -moz-transform:translate3d(-50px,0,0);}
.fromRight:not(.done) {opacity:0; filter:alpha(opacity=0); -ms-filter:alpha(opacity=0); transform:translate3d(50px, 0, 0); -webkit-transform:translate3d(50px, 0, 0); -o-transform:translate3d(50px, 0, 0); -ms-transform:translate3d(50px, 0, 0); -moz-transform:translate3d(50px, 0, 0); }
.fromBottom:not(.done) {opacity:0; filter:alpha(opacity=0); -ms-filter:alpha(opacity=0); transform:translate3d(0, 100px, 0); -webkit-transform:translate3d(0, 100px, 0); -o-transform:translate3d(0, 100px, 0); -ms-transform:translate3d(0, 100px, 0); -moz-transform:translate3d(0, 100px, 0);}
.fromTop:not(.done) {opacity:0; filter:alpha(opacity=0); -ms-filter:alpha(opacity=0); transform:translate3d(0, -100px, 0); -webkit-transform:translate3d(0, -100px, 0); -o-transform:translate3d(0, -100px, 0); -ms-transform:translate3d(0, -100px, 0); -moz-transform:translate3d(0, -100px, 0); }
.fromCenter:not(.done) {opacity:0; filter:alpha(opacity=0); -ms-filter:alpha(opacity=0); transform:scale(0.8) translate3d(0,0,0) ; -webkit-transform:scale(0.8) translate3d(0,0,0); -o-transform:scale(0.8) translate3d(0,0,0); -ms-transform:scale(0.8) translate3d(0,0,0); -moz-transform:scale(0.8) translate3d(0,0,0); }

.animate [class*='ani-'] {transition-property:transform, opacity; -webkit-transition-property:transform, opacity; transition-duration:0.8s; -webkit-transition-duration:0.8s; -o-transition-duration:.8s; -moz-transition-duration:.8s;   }
.animate.fast [class*='ani-'] {transition-duration:0.6s; -webkit-transition-duration:0.6s; -o-transition-duration:.6s; -moz-transition-duration:.6s;}
.animate.slow [class*='ani-'] {transition-duration:1s; -webkit-transition-duration:1s; -o-transition-duration:1s; -moz-transition-duration:1s;  }

.animate .ani-1 {transition-delay:10ms; -webkit-transition-delay:10ms; -o-transition-delay:10ms; -moz-transition-delay:10ms;}
.animate .ani-2 {transition-delay:160ms; -webkit-transition-delay:160ms; -o-transition-delay:160ms; -moz-transition-delay:160ms;}
.animate .ani-3 {transition-delay:320ms; -webkit-transition-delay:320ms; -o-transition-delay:320ms; -moz-transition-delay:320ms;}
.animate .ani-4 {transition-delay:480ms; -webkit-transition-delay:480ms; -o-transition-delay:480ms; -moz-transition-delay:480ms;}
.animate .ani-5 {transition-delay:640ms; -webkit-transition-delay:640ms; -o-transition-delay:640ms; -moz-transition-delay:640ms;}
.animate .ani-6 {transition-delay:800ms; -webkit-transition-delay:800ms; -o-transition-delay:800ms; -moz-transition-delay:800ms;}
.animate .ani-7 {transition-delay:960ms; -webkit-transition-delay:960ms; -o-transition-delay:960ms; -moz-transition-delay:960ms;}
.aniamte .ani-8 {transition-delay:1120ms; -webkit-transition-delay:1120ms; -o-transition-delay:1120ms; -moz-transition-delay:1120ms;}
.aniamte .ani-9 {transition-delay:1280ms; -webkit-transition-delay:1280ms; -o-transition-delay:1280ms; -moz-transition-delay:1280ms; }
.animate .ani-10 {transition-delay:1440ms; -webkit-transition-delay:1440ms; -o-transition-delay:1440ms; -moz-transition-delay:1440ms; }
.animate .ani-11 {transition-delay:1600ms; -webkit-transition-delay:1600ms; -o-transition-delay:1600ms; -moz-transition-delay:1600ms; }
.fast.animate .ani-1 {transition-delay: 10ms;-webkit-transition-delay: 10ms; -o-transition-delay:10ms; -moz-transition-delay:10ms;}
.fast.animate .ani-2 {transition-delay: 140ms;-webkit-transition-delay: 140ms; -o-transition-delay:140ms; -moz-transition-delay:140ms;}
.fast.animate .ani-3 {transition-delay: 270ms;-webkit-transition-delay: 270ms; -o-transition-delay:270ms; -moz-transition-delay:270ms;}
.fast.animate .ani-4 {transition-delay: 400ms;-webkit-transition-delay: 400ms;-o-transition-delay:400ms; -moz-transition-delay:400ms;}
.fast.animate .ani-5 {transition-delay: 530ms;-webkit-transition-delay: 530ms;-o-transition-delay:530ms; -moz-transition-delay:530ms;}
.fast.animate .ani-6 {transition-delay: 660ms;-webkit-transition-delay: 660ms;-o-transition-delay:660ms; -moz-transition-delay:660ms;}
.fast.animate .ani-7 {transition-delay: 790ms;-webkit-transition-delay: 790ms;-o-transition-delay:790ms; -moz-transition-delay:790ms;}
.fast.animate .ani-8 {transition-delay: 920ms;-webkit-transition-delay: 920ms;-o-transition-delay:920ms; -moz-transition-delay:920ms;}

.slow.animate .ani-1 {transition-delay: 10ms;	-webkit-transition-delay: 10ms;-o-transition-delay:10ms;-moz-transition-delay:10ms;}
.slow.animate .ani-2 {transition-delay: 210ms;-webkit-transition-delay: 210ms;-o-transition-delay:210ms; -moz-transition-delay:210ms;}
.slow.animate .ani-3 {transition-delay: 420ms;-webkit-transition-delay: 420ms;-o-transition-delay:420ms; -moz-transition-delay:420ms;}
.slow.animate .ani-4 {transition-delay: 630ms;-webkit-transition-delay: 630ms;-o-transition-delay:630ms; -moz-transition-delay:630ms;}
.slow.animate .ani-5 {transition-delay: 840ms;-webkit-transition-delay: 840ms;-o-transition-delay:840ms; -moz-transition-delay:840ms;}
.slow.animate .ani-6 {transition-delay: 1050ms;-webkit-transition-delay: 1050ms;-o-transition-delay:1050ms; -moz-transition-delay:1050ms;}
.slow.animate .ani-7 {transition-delay: 1260ms;-webkit-transition-delay: 1260ms;-o-transition-delay:1260ms; -moz-transition-delay:1260ms;}
.slow.animate .ani-8 {transition-delay: 1470ms;-webkit-transition-delay: 1470ms;-o-transition-delay:1470ms; -moz-transition-delay:1470ms;}

.scale [class*='sc-'] {transform:scale(1); -webkit-transform:scale(1); -o-transform:scale(1); -ms-transform:scale(1); -moz-transform:scale(1); transition-property:transform; -webkit-transition-property:transform; -o-transition-property:transform; -moz-transition-property:transform; transition-duration:0.8s; -webkit-transition-duration:0.8s; -o-transition-duration:0.8s; -moz-transition-duration:0.8s; }

.scale .fromSc9:not(.done) {transform:scale(0.9); -webkit-transform:scale(0.9); -o-transform:scale(0.9); -ms-transform:scale(0.9); -moz-transform:scale(0.9);}
.scale .fromSc8:not(.done) {transform:scale(0.8); -webkit-transform:scale(0.8); -o-transform:scale(0.8); -ms-transform:scale(0.8); -moz-transform:scale(0.8);}
.scale .fromSc7:not(.done) {transform:scale(0.7); -webkit-transform:scale(0.7); -o-transform:scale(0.7); -ms-transform:scale(0.7); -moz-transform:scale(0.7); }
.scale .fromSc6:not(.done) {transform:scale(0.6); -webkit-transform:scale(0.6); -o-transform:scale(0.6); -ms-transform:scale(0.6); -moz-transform:scale(0.6); }
.scale .fromSc5:not(.done) {transform:scale(0.5); -webkit-transform:scale(0.5); -o-transform:scale(0.5); -ms-transform:scale(0.5); -moz-transform:scale(0.5); }
.scale .fromSc11:not(.done) {transform:scale(1.1); -webkit-transform:scale(1.1); -o-transform:scale(1.1); -ms-transform:scale(1.1); -moz-transform:scale(1.1);}
.scale .fromSc12:not(.done) {transform:scale(1.2); -webkit-transform:scale(1.2); -o-transform:scale(1.2); -ms-transform:scale(1.2); -moz-transform:scale(1.2); }
.scale .fromSc13:not(.done) {transform:scale(1.3); -webkit-transform:scale(1.3); -o-transform:scale(1.3); -ms-transform:scale(1.3); -moz-transform:scale(1.3); }
.scale .fromSc14:not(.done) {transform:scale(1.4); -webkit-transform:scale(1.4); -o-transform:scale(1.4); -ms-transform:scale(1.4); -moz-transform:scale(1.4);}
.scale .fromSc15:not(.done) {transform:scale(1.5); -webkit-transform:scale(1.5); -o-transform:scale(1.5); -ms-transform:scale(1.5); -moz-transform:scale(1.5); }

.scale .sc-1 {transition-delay:10ms; -webkit-transition-delay:10ms; -o-transition-delay:10ms; -moz-transition-delay:10ms;}
.scale .sc-2 {transition-delay:160ms; -webkit-transition-delay:160ms; -o-transition-delay:160ms; -moz-transition-delay:160ms;}
.scale .sc-3 {transition-delay:320ms; -webkit-transition-delay:320ms; -o-transition-delay:320ms; -moz-transition-delay:320ms;}
.scale .sc-4 {transition-delay:480ms; -webkit-transition-delay:480ms; -o-transition-delay:480ms; -moz-transition-delay:480ms;}
.scale .sc-5 {transition-delay:640ms; -webkit-transition-delay:640ms; -o-transition-delay:640ms; -moz-transition-delay:640ms;}
.scale .sc-6 {transition-delay:800ms; -webkit-transition-delay:800ms; -o-transition-delay:800ms; -moz-transition-delay:800ms;}
.scale .sc-7 {transition-delay:960ms; -webkit-transition-delay:960ms; -o-transition-delay:960ms; -moz-transition-delay:960ms;}
.scale .sc-8 {transition-delay:1120ms; -webkit-transition-delay:1120ms; -o-transition-delay:1120ms; -moz-transition-delay:1120ms;}

.fast.scale .sc-1 {transition-delay: 10ms;-webkit-transition-delay: 10ms; -o-transition-delay:10ms; -moz-transition-delay:10ms;}
.fast.scale .sc-2 {transition-delay: 140ms;-webkit-transition-delay: 140ms; -o-transition-delay:140ms; -moz-transition-delay:140ms;}
.fast.scale .sc-3 {transition-delay: 270ms;-webkit-transition-delay: 270ms; -o-transition-delay:270ms; -moz-transition-delay:270ms;}
.fast.scale .sc-4 {transition-delay: 400ms;-webkit-transition-delay: 400ms;-o-transition-delay:400ms; -moz-transition-delay:400ms;}
.fast.scale .sc-5 {transition-delay: 530ms;-webkit-transition-delay: 530ms;-o-transition-delay:530ms; -moz-transition-delay:530ms;}
.fast.scale .sc-6 {transition-delay: 660ms;-webkit-transition-delay: 660ms;-o-transition-delay:660ms; -moz-transition-delay:660ms;}
.fast.scale .sc-7 {transition-delay: 790ms;-webkit-transition-delay: 790ms;-o-transition-delay:790ms; -moz-transition-delay:790ms;}
.fast.scale .sc-8 {transition-delay: 920ms;-webkit-transition-delay: 920ms;-o-transition-delay:920ms; -moz-transition-delay:920ms;}


.slow.scale .sc-1 {transition-delay: 10ms;	-webkit-transition-delay: 10ms;-o-transition-delay:10ms;-moz-transition-delay:10ms;}
.slow.scale .sc-2 {transition-delay: 210ms;-webkit-transition-delay: 210ms;-o-transition-delay:210ms; -moz-transition-delay:210ms;}
.slow.scale .sc-3 {transition-delay: 420ms;-webkit-transition-delay: 420ms;-o-transition-delay:420ms; -moz-transition-delay:420ms;}
.slow.scale .sc-4 {transition-delay: 630ms;-webkit-transition-delay: 630ms;-o-transition-delay:630ms; -moz-transition-delay:630ms;}
.slow.scale .sc-5 {transition-delay: 840ms;-webkit-transition-delay: 840ms;-o-transition-delay:840ms; -moz-transition-delay:840ms;}
.slow.scale .sc-6 {transition-delay: 1050ms;-webkit-transition-delay: 1050ms;-o-transition-delay:1050ms; -moz-transition-delay:1050ms;}
.slow.scale .sc-7 {transition-delay: 1260ms;-webkit-transition-delay: 1260ms;-o-transition-delay:1260ms; -moz-transition-delay:1260ms;}
.slow.scale .sc-8 {transition-delay: 1470ms;-webkit-transition-delay: 1470ms;-o-transition-delay:1470ms; -moz-transition-delay:1470ms;}


.vertical-i {animation:vb 1s infinite;}

@keyframes vb {
	0%{
		bottom: 0;
	}
	50% {
		bottom:10px;
	}
	100% {
		bottom:0px; 
	}
}

@keyframes vt{
	0%{
		top: 0;
	}
	50%{
		top:10px;
	}
	100%{
		top:0;
	}
}