@charset "utf-8";

.ir_pm {display:block; overflow:hidden; font-size:0; line-height:0; text-indent:-9999px} /* 사용된 이미지내 의미있는 텍스트의 대체텍스트를 제공할때 */
* {list-style: none;   margin: 0;   padding: 0;   text-decoration: none;   border: none;   box-sizing: none;}
img { -ms-interpolation-mode: bicubic; }


/*메인페이지 CSS 시작*/
#wrapper {width: 100%; text-align: center; }

.sub_default {width: 1200px; margin:0 auto;}
.hero-cnt {width: 100%; background: #fff; text-align: center; background-size: cover !important;}

#wrapper header .top {height: 720px; background:url('/sub_calendar_s4/img/clndrcon_top.jpg') top center no-repeat}
/*
#wrapper header .top h1 {margin-top:60px; font-size: 50px;line-height: 70px;letter-spacing: -1px;display: inline-block;color: #333; font-weight: normal;}
#wrapper header .top h2 {margin-top:20px; font-size: 18px;line-height: 30px;color: #333;font-weight: normal;}
#wrapper header .top h4 {padding-left: 200px; margin-top: 150px; font-weight: 300; color: #666;}
*/


/*상품리스트*/
#wrapper .list {width:100%; padding:90px 0 70px 0; text-align:left;}

/*컨텐츠 사이즈와 가격*/
#wrapper .calendar_size_price {width: 100%; margin: 0 auto;}
#wrapper .calendar_size_cnt {margin: 50px auto 0 auto; width: 1000px;}
#wrapper .calendar_size_cnt img {margin-bottom: 30px;}
#wrapper .calendar_size_txt_wrap { width: 1000px; height: 250px; margin: 30px 0px 70px 0px;}
#wrapper .calendar_size_txt {width: 250px;height: auto;margin: 0 auto;float:left;position:relative;text-align: center;}
#wrapper .size_txt_a {font-size: 16px; line-height: 24px; color: #2e2e2e;}
#wrapper .size_txt_c {font-size: 12px;line-height: 24px;color: #868686;}
#wrapper .calendar_cnt_title p{font-size: 50px;line-height: 60px;color: #000000;text-align: center;}


/*특별한이유*/
#wrapper .ptb_cnt_area { width: 100%; height:auto; margin: 0 auto;}
#wrapper .ptb_cnt_area {padding: 120px 0 100px 0;}
#wrapper .ptb_cnt_title p{font-size: 50px;line-height: 60px;color: #333333;text-align: center;}

#wrapper .ptb_special {height:1080px;}
#wrapper .ptb_special_cnt{ margin: 30px 0;    height: 920px;}
#wrapper .ptb_special_cnt_item{margin: 0 auto; width: 984px; height: auto;}
#wrapper .ptb_special_cnt ul .special_item_margin {margin: 25px 30px;}
#wrapper .ptb_special_cnt ul li {    float: left; margin: 25px 0; text-align: center; width: 308px; height: 400px;}
#wrapper .ptb_special_cnt .ptb_special_cnt_item p{text-align: center; font-size: 14px; line-height: 20px; color: #999999;}
#wrapper .ptb_special_cnt .ptb_special_cnt_item .cnt_item_title {font-size: 20px; line-height: 45px; color: #333333;}


/*하단 안전한 전용 포장과 빠른 배송*/
.main_delivery_wrap { margin: 0 auto; width: 1000px; height: 860px;}
.cmn_txt_wrap .cmn_txt_sub_dlvr { font-size: 16px; line-height: 24px; color: #333333;}


/*컨텐츠 포토북 할인제도*/
.cmn_discount_warp {width: 100%; height: 680px;}
.ptb_cnt_discount { height: 545px;}
.cnt_discount { width: 100%; margin: 42px 0;}
.cnt_discount_img { width: 1000px;  height: 365px; margin: 0 auto;}
.cnt_discount_img li { margin: 0 10px; float: left;}
.cnt_discount_img li:first-child { margin-left: 0;}
.cnt_discount_img li:last-child { margin-right: 0;}
.main_cnt_title .main_cnt_title_txt{text-align: center; font-size: 40px; color: #333333;}
.main_cnt_title .cmn_txt_title {font-size: 24px; color: #333333; line-height: 60px;}
.cnt_discount_img li:hover img {opacity: 0.7; transition: opacity .25s ease-in-out; 
	-moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;}
.cnt_discount_img .cnt_discount_img_item img{float: left; margin: 10px; opacity: 1;	transition: opacity .25s ease-in-out;
	-moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;}


/* 네비게이션 추가 */
.hero-nav {display:none; z-index:999; position:fixed; top:0; left:0; width:100%; height:60px; background-color: rgba(255, 255, 255, 0.95); box-shadow: 0px 1px 15px 0px #b3b3b3;}

.hero-nav .nav-wrap a.none {background:none}
.hero-nav .nav-wrap button {position:absolute; top:12px; right:0; width:160px; height:35px; line-height:35px; font-size:15px; color:#fff; background:#222450; transition: .3s;}
.hero-nav .nav-wrap button:hover {background:#4e58c2; transition: .3s;}

.hero-nav .nav-wrap {position:relative; width:1200px; margin:0 auto; text-align:left;}
.hero-nav .nav-wrap li {display:inline-block;}
.hero-nav .nav-wrap li a {display:inline-block; margin:18px 17px 0 0; padding-right:20px; background: url('/sub_printing_s3/images/line.gif') right 7px no-repeat;}
.hero-nav .nav-wrap li a.active {font-weight:bold; color:#000}
.hero-nav .nav-wrap li div.btns {position:absolute; top:12px; right:0}
.hero-nav .nav-wrap li div.btns a {display:inline-block; width:150px; height:35px; margin:0 0 0 5px; padding:8px 0 0 0; text-align:center; color:#fff; background:#262853; box-sizing:border-box; transition:0.5s;}
.hero-nav .nav-wrap li div.btns a.btn2 {background:#202737}
.hero-nav .nav-wrap li div.btns a:hover {background:#4e58c2; transition:0.5s;}

.tit_btn {display:inline-block; width:260px; height:70px; margin-top:50px; padding-top:22px; font-size:25px; font-weight:500; color:#7c7c7c; text-align:center; border: 1px solid #7c7c7c; box-sizing:border-box; transition:0.7s}
.tit_btn:hover {color:#fff; border: 1px solid #222450; background:#222450; transition:0.5s}
#wrapper > .best {padding:100px 0 0 0; background:#316451; overflow:hidden}
#wrapper .best h3 {font-size:48px; line-height:48px; color:#fff}
#wrapper .best .tab_default .tab_box {margin-top:70px; border-bottom:1px solid #fff}
#wrapper .best .tab_default .tab_box ul {width:1000px; margin:0 auto}
#wrapper .best .tab_default .tab_box ul li {display:inline-block; padding:0 37px 15px 37px; margin:0 35px; font-size:19px; color:#fff; cursor:pointer}
#wrapper .best .tab_default .tab_box ul li.active {color:#fff; border-bottom:4px solid #fff}
#wrapper .best .tab_default .tab_cont_wrap {width:100%; height:600px; margin:70px auto 0 auto; position:relative;}
#wrapper .best .tab_default .tab_cont_wrap .cont_box {position:relative; width:100%; height:600px; visibility:hidden; position:absolute; top:0; left:0}
#wrapper .best .tab_default .tab_cont_wrap .cont_box:first-child {visibility:visible}
#wrapper .best .tab_default .tab_cont_wrap .cont_box .tit {width:1000px; margin:0 auto; padding-top:70px; text-align:left;}
#wrapper .best .tab_default .tab_cont_wrap .cont_box h4 {font-size:30px; color:#000}
#wrapper .best .tab_default .tab_cont_wrap .cont_box p {font-size:16px; margin-top:30px; color:#000}
#wrapper .best .tab_default .tab_cont_wrap .cont_box .cnt-slidebox .img-slide, #wrapper .best .tab_default .tab_cont_wrap .cont_box .cnt-slidebox .img-slide2 {width:100%; height:600px;}
.m-v-direct-new {z-index: 10; position: absolute; top: 230px; right: 50%; width:1000px; margin-right:-500px; text-align: left;}
.m-v-direct-new ul li {margin:8px 0;}
.m-v-direct-new ul li button {font-size:14px; color:#7c7c7c }
.m-v-direct-new ul li.current button {color:#316451;}
.m-v-direct-new ul li button span {display: inline-block; width:15px; height:15px; margin-right:15px; vertical-align:sub; background:#7c7c7c}
.m-v-direct-new ul li.current button span {background:#316451;}



.w1200 {width: 1200px; display: block; position: relative; margin: 0 auto;}
.renew {padding: 100px 0 150px; border-top: 1px solid #ddd;}
.renew .txt_em {font-size: 20px; font-weight: bold; line-height: 28px; margin-bottom: 10px;}
.renew .lh_double {font-size: 50px; line-height: 70px; letter-spacing: -1.2px;}
.renew .summary_box {width: 100%; background: url('/sub_calendar_s8/img/n_cldr_diy_01_bg.jpg?t=1') center no-repeat; margin: 80px 0 0; height: 507px;}  
.renew .summary_box::after {display: block; clear: both; content: ""}
.renew .summary_box .w1200 > div {float: left;}
/* slide area */
.renew .slide_box {width: 100%; padding: 80px 0; background: #fff;}
.renew .theme_wrap {display: block; width: 1200px; height: 500px; margin: 0 auto; margin-bottom: 120px}
.renew .evt_swipe {position:relative; overflow: hidden; height: 500px}
.renew .evt_swipe .swiper-wrapper .swiper-slide img.inner_cont {position: relative; display: inline-block;}
.renew .evt_swipe .swiper-wrapper .swiper-slide > span {position: relative; bottom: -30px; left: -510px; color: #90acd1; font-size: 15px; font-weight: 500; letter-spacing: 2.4px; display: inline-block; background-color: #fff; padding: 0 5px}
.renew .evt_swipe .swiper-button-next {bottom:0; right:0; left:auto; top:auto; width:80px; height:80px; background:url(/sub_fancy/img/photocard/swipe_arrow_next.jpg?t=1) no-repeat;}
.renew .evt_swipe .swiper-button-prev {bottom:0; right:80px; left:auto; top:auto; width: 80px; height: 80px; background:url(/sub_fancy/img/photocard/swipe_arrow_pre.jpg?t=1) no-repeat;}
.renew .slide_textarea {display: inline-block; position: relative; float: right; width: 450px; background-color: #f7f7f7; padding: 80px 60px; box-sizing: border-box; height: 500px; text-align: left; }
.renew .slide_textarea .theme_num {font-size: 22px; font-weight: 700; color: #2b63ad; margin-bottom: 30px; display: inline-block;}
.renew .slide_textarea dl dt {font-size: 26px; color: #333; font-weight: 300; padding-bottom: 50px; line-height: 36px;}
.renew .slide_textarea dl dd {font-size: 18px; line-height: 32px; color: #666;}
/* contents */
.renew .diy_contbox {padding-top: 40px;}
.renew .diy_contbox .diy_tit h3 {font-size: 28px; line-height: 42px; color: #111; text-align: center;}
.renew .diy_contbox .diy_tit {margin-bottom: 80px;}
.renew .diy_contbox .diy_cont .diy_cont_bg {width: 100%; height: 550px; display: block; background-size: cover; margin-top: 70px;}
.renew .diy_contbox .diy_cont .bg1 {background: url('/sub_calendar_s8/img/n_cldr_diy_03_1.jpg?t=1');}
.renew .diy_contbox .diy_cont .bg2 {background: url('/sub_calendar_s8/img/n_cldr_diy_03_2.jpg?t=1');}
.renew .diy_contbox .diy_cont .bg3 {background: url('/sub_calendar_s8/img/n_cldr_diy_04_1.jpg?t=1');}
.renew .diy_contbox .diy_cont .bg4 {background: url('/sub_calendar_s8/img/n_cldr_diy_04_2.jpg?t=1');}
.renew .diy_contbox .diy_cont .bg5 {background: url('/sub_calendar_s8/img/n_cldr_diy_05_1.jpg?t=1');}
.renew .diy_contbox .diy_cont .bg6 {background: url('/sub_calendar_s8/img/n_cldr_diy_05_2.jpg?t=1');}
.renew .diy_contbox .diy_cont .bg7 {background: url('/sub_calendar_s8/img/n_cldr_diy_06_1.jpg?t=1');}
.renew .diy_contbox .diy_cont p {font-size: 22px; color: #111; line-height: 36px; margin-top: 40px;}
.renew .diy_contbox .diy_cont p em {font-style: normal; font-weight: bold; display: inline-block; border-bottom: 15px solid #fff1c4; padding: 0 5px; height: 20px;}
.renew .diy_contbox .diy_cont p span {font-size: 20px; color: #888;}
.renew .diy_contbox .diy_cont_tip {background: #f3f3f3; width: 100%; height: 150px; margin-top: 100px;}

/* 달력 리뉴얼 */
.sec_box {position:relative; padding:150px 0 120px 0 !important; text-align: center;}
.sec2 {/*background:#faeae1 url(/sub_book_s8/img/new/sec2_bg.jpg) top center no-repeat*/}
.sec_box > h2 {font-size:50px; color:#262626; text-align: center; font-weight:normal;}
.sec_box > h3 {margin-bottom:35px; font-size:30px; color:#262626; text-align: center; font-weight:normal;}
.sec_box > p {margin-top:50px; font-size:18px; color:#333; text-align: center; line-height:30px}

.sec2 .sec2_con {position:relative; width:1100px; margin:60px auto 0 auto; text-align: center; }
.sec2_swipe {padding:25px; overflow: hidden; text-align: center}
.sec2_swipe .swiper-wrapper {height:310px;}
.sec2_swipe .book_box {position:relative; display: inline-block; width:310px; height:253px !important; transition: 0.3s;}
.sec2_swipe .book_box:hover {box-shadow: 7px 7px 15px 0px #d9ccc3; transition: 0.3s}
.sec2_swipe .book_box .tit {position:absolute; bottom:-50px; left:0; width:100%; text-align: center;}
.sec2_swipe .book_box .tit h3 {margin:20px 0 7px 0; font-size:21px; color:#262626}
.sec2_swipe .book_box .tit p {width:100px; height:23px; margin:0 auto; padding-top:2px; font-size:12px; color:#fff; background:#333; border-radius:30px; box-sizing: border-box}
.sec2_swipe .book_box .tit span {font-size:12px; color:#808080}
.sec2 .sec2_con > img {position:absolute; bottom:115px; left:55%; z-index: 9}

.sec_box button.default_btn {position:relative; width:350px; height:80px; margin:70px auto 0 auto; font-size:20px; color:#333; border:2px solid #333; box-sizing: border-box; transition:.3s all;}
.sec_box button.default_btn:before{content:'';position:absolute;width:0%;top:0;left:0;height:100%;background:#222450;transition:.3s;}
.sec_box button.default_btn:hover{z-index: 99; color:#fff; border:2px solid #222450;}
.sec_box button.default_btn:hover:before {width:100%; z-index: -1}

.sec_box button.default_btn:hover { z-index: 99;color: #fff;border: 2px solid #222450;}
.sec_box.books_07 {height:500px; padding:110px 0 !important; text-align:left !important; background:url(/sub_book_s8/category/book_category_sec7_bg.jpg?t=1) 50%/cover no-repeat; box-sizing:border-box;}
.w1200 {width:1200px; margin:0 auto;}
.books_07 h2 {font-size:30px; line-height:40px; color:#333;}
.books_07 p {margin-top:20px; font-size:18px; line-height:30px}
.books_07 button {width:250px !important; height:70px !important; margin-top:50px !important}

.renew .activeTxt_07 {position:relative; width:1200px; margin:0 auto; text-align: left;}
.renew .activeTxt_07 p {text-align:left;}
.renew .activeTxt_07 img {position:absolute; bottom:0; right:0; margin-top:40px;}

.diy_ul {display:flex; justify-content: center}
.diy_ul li:first-child {margin-right:30px}
.diy_ul li div {width:100%; height:500px; background-size:cover}
.diy_ul li p {font-size: 22px;color: #111; line-height: 36px; margin-top: 40px;}
.diy_ul li p em {font-style: normal;font-weight: bold;display: inline-block;border-bottom: 15px solid #fff1c4;padding: 0 5px;height: 20px;}
.diy_ul li p span {font-size: 20px;color: #888;}

/* 탭 디폴트 */
.tab_default2 {position:relative; width:100%; margin-top:70px}
.tab_default2 ul.tab_btn_wrap2 {width:1200px; margin:0 auto; display:flex;}
.tab_default2 ul.tab_btn_wrap2::before {content: ""; width:100%; position:absolute; top:70px; left:0; height:1px; background:#e5e5e5}
.tab_default2 ul.tab_btn_wrap2 > li {width:25%; height:70px; padding-bottom:10px; font-size:16px; color:#888; text-align: center; cursor: pointer; box-sizing: border-box;}
.tab_default2 ul.tab_btn_wrap2 > li.active {z-index: 1; border-bottom:3px solid #4e4eb5;}
.tab_default2 ul.tab_btn_wrap2 > li.active span {font-family:'Montserrat','YoonGothicPro760', sans-serif; opacity:1; color:#000;}
.tab_default2 ul.tab_btn_wrap2 > li > span {font-size:20px; line-height:25px; opacity:0.5;}
.tab_default2 ul.tab_btn_wrap2 > li > span em {font-style: normal; font-size:18px; font-weight:600; color:#4e4eb5;}
.tab_cont_wrap2 .cont_box2 {display: none}
.tab_cont_wrap2 .cont_box2:first-child {display: block;}


header .top .cldr_top ul.slide li h1 {font-size: 50px;line-height: 30px;letter-spacing: -1px;display: inline-block;color: #333; font-weight: normal;}
header .top .cldr_top ul.slide li h2 {font-size: 18px;line-height: 70px;color: #333;font-weight: normal;}

/*공통버튼*/
header .top .cldr_top ul.slide li a.btn {margin: 0 auto; display: block; position:relative; width:250px; height:70px; margin-top:40px; font-size:20px; color:#333; border:2px solid #333; box-sizing: border-box; transition:.3s all;}
header .top .cldr_top ul.slide li a.btn:before{content:'';position:absolute;width:0%;top:0;left:0;height:100%;background:#222450;transition:.3s;}
header .top .cldr_top ul.slide li a.btn:hover{z-index: 99; color:#fff; border:2px solid #222450;}
header .top .cldr_top ul.slide li a.btn:hover:before {width:100%; z-index: -1}
header .top .cldr_top ul.slide li a.btn span{line-height: 65px;  letter-spacing: 1px;}

header .top .main_tit {position: relative; width: 100%; z-index: 999 !important; padding-top: 60px; text-align: center;}
header .top .cldr_top {width: 100%; background: #f8f8f8; height: 720px; text-align: center; background-size: cover !important; margin: 0 auto}
header .top .cldr_top ul.slide li {background-size: 1920px !important; height: 720px; width: 100%; margin: 0 auto; image-rendering: -webkit-optimize-contrast;}
header .top .cldr_top ul.slide li.cldr1 {background: url('/sub_calendar_s8/img/cldr_big_table.jpg?t=1') center no-repeat;}
header .top .cldr_top ul.slide li.cldr2 {background: url('/sub_calendar_s8/img/cldr_big_wall.jpg?t=1') center no-repeat;}
header .top .cldr_top ul.slide li.cldr3 {background: url('/sub_calendar_s8/img/cldr_big_wall2.jpg?t=1') center no-repeat;}
header .top .cldr_top ul.slide li.cldr4 {background: url('/sub_calendar_s8/img/cldr_big_wood.jpg?t=1') center no-repeat;}
header .top .cldr_top ul.slide li.cldr5  {background: url('/sub_calendar_s8/img/cldr_big_mini.jpg?t=1') center no-repeat;}

header .top {width:100%; margin:0px auto; height: 720px; overflow: hidden; position: relative; }
header .top .slide {width: 100%}
header .top .slide li {  width: 100%;  height: 100%; }
header .top .slide li img { width: 100%; height: 100%;}
header .top .dot { position: absolute;  bottom: 20px; left: 50%;  transform: translateX(-50%);    }
header .top .dot li {box-sizing: border-box; border: 2px solid #222450;width: 20px; border-radius: 50%; height: 20px; margin: 15px; float: left; cursor: pointer; transition: all 3s ease;    }

.calendar_swipe .swiper-pagination-bullet {background: #fff; opacity:1; box-sizing: border-box; border: 2px solid #222450; width: 20px; border-radius: 50%; height: 20px; margin: 15px !important; cursor: pointer;}
.calendar_swipe.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {margin: 15px !important;}
.calendar_swipe .swiper-pagination-bullet-active {background:#222450 !important;}
.calendar_swipe .swiper-pagination {bottom:5px !important}


.cldr_07 {height: 500px; padding: 110px 0 !important; text-align: left !important; background: url('/sub_calendar_s8/img/cldr_delivery_codi.jpg?t=3') 50%/cover no-repeat; box-sizing: border-box;}
.cldr_07 h2 {font-size:30px; line-height:40px; color:#333;}
.cldr_07 p {margin-top:20px; font-size:18px; line-height:30px}
.cldr_07 button {width:250px !important; height:70px !important; margin-top:50px !important}


.cnt-slidebox {position:relative; width:100%; text-align:center;}
.cnt-slidebox .swiper-wrapper {width:100%; text-align:center;}
.cnt-slidebox .swiper-slide {overflow:hidden; position:relative; }
.renew .diy_contbox {background-color: #fff !important; height: 1080px;}
	
.m-v-nav {z-index:1; position:absolute; top:56%;width:100%;  margin-top:-30px;}
.cnt-slidebox .m-v-prev2 {position:absolute; left:50px; width:60px; height:60px; background: url('/re_181207/images/big_arrow.png') center no-repeat; background-position:0 0; transition: 0s !important;}
.cnt-slidebox .m-v-prev2:hover {background-position:-60px 0; transition: 0s !important;}
.cnt-slidebox .m-v-next2 {position:absolute; right:50px; width:60px; height:60px; background: url('/re_181207/images/big_arrow.png') center no-repeat; background-position:0 -60px; transition: 0s !important;}
.cnt-slidebox .m-v-next2:hover {background-position:-60px -60px; transition: 0s !important;}
	
/* 탭 디폴트 */
.m-v-direct-new2 {position:relative; width:100%; margin-top:70px}
.m-v-direct-new2 ul {width:1200px; margin:0 auto; display:flex;}
.m-v-direct-new2 ul::before {content: ""; width:100%; position:absolute; top:69px; left:0; height:1px; background:#e5e5e5}
.m-v-direct-new2 ul > li {width:25%; height:70px; padding-bottom:10px; font-size:16px; color:#888; text-align: center; cursor: pointer; box-sizing: border-box;}
.m-v-direct-new2 ul > li.current {z-index: 1; border-bottom:3px solid #4e4eb5;}
.m-v-direct-new2 ul > li.current span {font-family:'Montserrat','YoonGothicPro760', sans-serif; opacity:1; color:#000;}
.m-v-direct-new2 ul > li  span {font-size:20px; line-height:25px; opacity:0.5;}
.m-v-direct-new2 ul > li  span em {font-style: normal; font-size:18px; font-weight:600; color:#4e4eb5;}