@charset "utf-8";
#container {min-height:0 !important;}
/* doc.css는 디자인페이지 스타일을 정의합니다. */
/* sub01_01 인사말 */
.greeting {height:650px; background:url('../images/sub/greeting01.jpg') no-repeat; position:relative; background-size:cover; background-position:center bottom;}
.greeting .cnt {position:absolute; top:60px; left:50%; transform:translateX(-50%); width:100%; text-align:center;}
.greeting .pic {margin-bottom:28px;}
.greeting .txt {font-size:17px; line-height:1.7em; color:#454545; padding:0 10px;}
/* sub01_02 경영이념 */
.ideology .wrap {display:flex; margin-left:-20px;}
.ideology .wrap .box {width:50%; margin-left:20px; text-align:center;}
.ideology .wrap .box h3 {font-size:28px; line-height:1.1em; margin-bottom:42px;}
.ideology .wrap .box h3.health {color:#f0cc5e;}
.ideology .wrap .box h3.fun {color:#31beba;}
.ideology .wrap .box .img-box {margin-bottom:48px;}
.ideology .wrap .box .pic {position:relative; height:0; padding-bottom:65.93%; overflow:hidden;}
.ideology .wrap .box .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.ideology .wrap .box p {font-size:18px; line-height:1.5em; color:#454545;}
/* sub01_03 조직도 */
.organization .img-box {text-align:center; padding-bottom:30px;}
/* sub01_04 오시는 길 */
.directions h3 {font-size:20px; line-height:1.4em; font-weight:500; color:#454545; margin-bottom:18px;}
.directions .root_daum_roughmap {width:100% !important; height:450px !important;}
.directions .root_daum_roughmap .wrap_map {height:450px !important;}
.directions .roughmap_lebel_text {line-height:0 !important; font-size:0 !important;}
.maps1 .roughmap_lebel_text:after {content:"CSI 본사 및 공장"; font-size:12px; line-height:15px;}
.maps2 .roughmap_lebel_text:after {content:"연구개발실"; font-size:12px; line-height:15px;}
.directions ul {margin-bottom:50px;}
.directions ul li {margin:20px 0; padding-bottom:20px; border-bottom:1px solid #ddd;}
.directions ul li span {min-width:150px; display:inline-block; text-align:center; position:relative;}
.directions ul li span:after {content:""; width:1px; height:20px; background:#ddd; position:absolute; top:50%; margin-top:-10px; right:0;}
.directions ul li p {display:inline-block; padding-left:35px;}
/* sub02 제품소개 */
.doc-tit {margin-bottom:40px; text-align:center;}
.doc-tit h3 {font-size:30px; line-height:1.4em; color:#242424; letter-spacing:.015em; font-family:'TmonMonsori'; margin-bottom:20px;}
.doc-tit p {font-size:18px; line-height:1.6em; color:#454545;}
.doc-list {display:flex; flex-wrap:wrap; margin-left:-30px; margin-bottom:50px; text-align:center;}
.doc-list li {width:calc(33.33333% - 30px); margin-left:30px; margin-bottom:30px; padding:30px; background:#f5f5f5;}
.doc-list li .pic {margin-bottom:18px;}
.doc-list li h3 {font-size:20px; line-height:1.6em; color:#242424;}
.doc-list li p {font-size:15px; font-weight:500; line-height:1.4em; color:#686868;}
.doc-wrap {background:#f9f7eb; padding:15px;}
.doc-box {display:flex; align-items:center; border:1px solid #ddd; padding:25px 0;}
.doc-box .img-box,
.doc-box .txt {width:50%;}
.doc-box .img-box {text-align:center;}
.doc-box .txt p {font-size:18px; line-height:1.6em; color:#454545; font-weight:500; margin-bottom:20px;}
.doc-box .txt h4 {font-size:22px; line-height:1.3em; color:#242424;}
.doc-box .txt strong {font-size:30px; line-height:1.2em; display:block; margin-left:100px;}
.doc-box .txt img {margin-right:35px;}
.product.cookie .doc-wrap,
.product.pound .doc-wrap {margin-bottom:15px;}
.product.tarte .doc-list,
.product.brownie .doc-list {justify-content:center;}
/* sub02_01 시그니처 */
.signature {background:#f4f4f4; padding:44px 110px 100px; text-align:center;}
.signature .img-box {margin-bottom:70px;}
.signature h4 {font-size:25px; line-height:1.2em; color:#242424; font-weight:500; margin-bottom:40px;}
.signature .img-box {background:#fff;}
.signature .img-box ul {display:flex; flex-wrap:wrap; padding:60px 0; margin-bottom:-30px;}
.signature .img-box ul li {width:20%; margin-bottom:30px; position:relative;}
.signature .img-box ul li:after {content:""; width:1px; height:50%; background:#ddd; position:absolute; top:50%; right:0; transform:translateY(-50%);}
.signature .img-box ul li:nth-child(5):after {display:none;}
.signature .img-box ul li:nth-child(10):after {display:none;}
/* sub02_02 신제품*/
.new-product {background:#f9f7eb; padding:50px 110px 40px;}
.new-product .pic {position:relative; height:0; overflow:hidden;} /* padding-bottom:65.5%; */
.new-product .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.new-product .wrap .pic {padding-bottom:68%;}
.new-product .cookie .pic {padding-bottom:97.82%;}
.new-product .cookie ul li:last-child .pic {padding-bottom:38.77%;}
.new-product .dacquoise .pic {padding-bottom:78%;}
.new-product .dacquoise .last-box .pic {padding-bottom:60%;}
.new-product .wrap {background:#fff; margin-bottom:80px;}
.new-product .wrap .box {display:flex; align-items:center;}
.new-product .wrap .box .img-box {padding:60px 30px; width:40%; text-align:center;}
.new-product .wrap .box .txt {width:60%; padding-right:95px;}
.new-product .wrap .box .txt h4 {font-size:20px; line-height:1.4em; color:#000; border-bottom:1px solid #ddd; margin-bottom:14px; padding-bottom:14px;}
.new-product .wrap .box .txt h4 span {display:block; font-size:15px; line-height:1.8em; color:#686868; font-weight:500;}
.new-product .wrap .box .txt p {font-size:18px; line-height:1.6em; font-weight:500; color:#454545;}
.new-product .cookie {margin-bottom:80px;}
.new-product .cookie ul {display:flex; margin-left:-60px; flex-wrap:wrap;}
.new-product .cookie ul li {width:calc(50% - 60px); margin-left:60px; margin-bottom:30px;}
.new-product .cookie ul li:last-child {width:100%; margin-bottom:0;}
.new-product .cookie ul .img-box {margin-bottom:18px;}
.new-product .cookie ul .txt h4 {font-size:20px; line-height:1.4em; color:#000; text-align:center;}
.new-product .cookie ul .txt h4 span {display:block; font-size:15px; line-height:1.8em; color:#686868; font-weight:500;}
.new-product .dacquoise .box .img-box {padding:50px 80px; text-align:center;}
.new-product .dacquoise .last-box .img-box {padding:50px;}
.notice .txt {font-size:18px; line-height:1.6em; color:#454545; font-weight:500; text-align:center; margin-bottom:26px;}