/* Add here all your CSS customizations */


/* ŸÀÓ¶óÀÎ ¹Ú½º À½¿µ ´õÁÖ±â  */
section.timeline .timeline-box {
	-webkit-box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.04);
	box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.04);
	border: 1px solid #E5E5E5;
	transition-duration:0.4s; 
}
section.timeline .timeline-box:hover {
	-webkit-box-shadow: 5px 2px 10px 0 #2c1792;
	box-shadow: 1px 1px 5px 0 #444;
	border: 1px solid #2c1792;

	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-ms-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}


@media (max-width: 575px) {
	section.timeline {
		width:100% ;  /* auto ³ÖÀ¸¸é ÆøÀÌ È®ÁÙ¾îµë  */
	}
}
/* À¥º£½ºÆ®ÇÏ´Ü¿¡ °íÁ¤ ±¤°í ¹è³Ê */
#salesbar {
    bottom: 0px;
    background-color: #d62196;
    position: fixed;
    z-index: 100;
    width: 100%;
    height: auto;
    margin-bottom: 0px !important;
	text-align:center
}

#salesbar img {}
/*
.pprocess {border:1px solid #333; padding: 15px; height:auto}  ÇÁ·ÎÀèÆ® ÇÁ·Î¼¼½º */
.pprocess .post-image {border:1px #333 solid; transition-duration:0.4s; }
.pprocess:hover .post-image {	
	-webkit-box-shadow: 5px 2px 10px 0 #2c1792;
	box-shadow: 1px 1px 5px 0 #444;
	border: 1px solid #2c1792;	
	}
.pprocess:hover h2{color:#2c1792}

body p {letter-spacing:-1px}

/* Æ÷Æ®Æú¸®¿À ½æ³×ÀÏ À̹ÌÁö ¿À¹ö½Ã º¸´õ »ö±ò ³Ö±â */
.hover-effect-1.portfolio-item img {
	transition-duration: 0.4s;
}
.hover-effect-1.portfolio-item img:hover{
	border: 12px solid  #00fffc;    /*  #3ebeb3 */
transition: all 0.2s ease-in-out;
transition-duration: 0.4s;

}

.modal-body.aside_right  label{color:#fc6b41}

/* Äü¸Þ´º */
#quickmenu {position:fixed; top:220px; right:20px; z-index:999}
#quickmenu .iconlist > li {display:block; width:80px; height:80px; font-size:12px; color:#fff; text-align:center; line-height:80px; margin-bottom:1px; background:#222; cursor:pointer}
#quickmenu .iconlist > li.icon1:hover, #quickmenu .iconlist > li.icon1.on {background:#fc6b41}
#quickmenu .iconlist > li.icon2:hover, #quickmenu .iconlist > li.icon2.on {color:#222; background:#ffea29}
#quickmenu .iconlist > li.icon3:hover, #quickmenu .iconlist > li.icon3.on {background:#fc6b41}
#quickmenu .iconlist > li.icon4:hover, #quickmenu .iconlist > li.icon4.on {background:#21bbb1}
#quickmenu .quick-layer {position:fixed; top:220px; right:-480px; padding:45px 50px; width:480px; height:640px; background:rgba(0, 0, 0, .9); z-index:900}
#quickmenu .quick-layer .title {margin-bottom:40px}
#quickmenu .quick-layer .title h2 {font-size:30px; font-weight:600; color:#fff; margin-bottom:5px}
#quickmenu .quick-layer .title p {color:#fff}
#quickmenu .quick-layer .title.kakao h2 {color:#ffea29}
#quickmenu .quick-layer .title.kakao p {color:#ffea29}
#quickmenu .quick-layer .btn-close {position:absolute; top:45px; right:44px; width:45px; height:45px; border:none; background:transparent; cursor:pointer; outline:none}
#quickmenu .quick-layer .btn-close span {position:absolute; display:block; top:50%; left:50%; width:38px; height:1px; margin:-1px 0 0 -19px; background:#fff}
#quickmenu .quick-layer .btn-close span.line1 {transform:rotate(45deg)}
#quickmenu .quick-layer .btn-close span.line2 {transform:rotate(-45deg)}
#quickmenu .quick-layer .btn-area {position:absolute; bottom:45px; left:0; width:100%; text-align:center}
#quickmenu .quick-layer .btn-area .btn {display:inline-block; padding:8px 20px; font-size:15px; color:#fff !important; border-radius:0}
#quickmenu .quick-layer .btn-area .btn.btn-brown {border-color:#867460 !important; background:#867460 !important}
#quickmenu .quick-layer .btn-area .btn.btn-yellow {color:#222 !important; border-color:#ffea29 !important; background:#ffea29 !important}
#quickmenu .quick-layer .btn-area .btn.btn-mint {border-color:#21bbb1 !important; background:#21bbb1 !important}


/* ¸ð¹ÙÀÏ¿¡¼­ */
@media (max-width: 575px) {

	#quickmenu { right:10px; }
	#quickmenu .quick-layer {top:30px; right:100px; width:100%; height:auto;}
	#quickmenu .quick-layer .title {margin-bottom:-10px}
	#quickmenu .quick-layer img {width:100%; max-width:362px; margin:auto; display:block}
	#quickmenu .quick-layer label {display: none}
	
	#quickmenu .quick-layer .btn-area {
	bottom:35px; 
   /*
   position: absolute;
    top: 45px;
    right: 100px;
    width: 120px; 
    text-align: center;
   display:inline;
*/
	}
	#quickmenu .quick-layer .title h2 {
    margin-bottom: 0; }

	#quickmenu ul.iconlist  li.icon1 {display:none}


}



/* ¿ÞÂÊ ÇÏ´Ü µðÀÚÀÎ »ùÇú¸±â ¹öÆ° */
/* desianSample Button */
span.designSample {position:fixed; display:inline-block; width:50px;font-size:20px; height:50px; bottom:50px;left:50px; margin-top:-25px; color:#fff; text-align:center; line-height:55px;background:#0c0c0c; border:1px solid #0c0c0c; border-radius:50px;-webkit-transition:all .4s;transition:all .4s;z-index:99;}
span.designSample i {-webkit-transition:all .4s;transition:all .4s}
span.designSample:hover i {opacity:0;}
span.designSample:hover {width:170px;height:50px;background:#21bbb1;border:solid 1px #21bbb1;}
span.designSample p {-webkit-transition:all .4s;transition:all .4s;opacity:0;color:#fff;position:absolute;top:-2px;font-size:16px;overflow:hidden;height:50px;  line-height: 50px;}
span.designSample:hover p {display:block;margin-left:33px; color:#fff; opacity:1 }

span.designSample .icon-featured {
	display: inline-block;
    font-size: 0;
   margin: -1px; 
    width: 51px;
    height: 51px;
    border-radius: 50%;
    text-align: center;
    position: relative;
    z-index: 1;
    color: #FFF;
    font-size: 20px;
    line-height: 51px;
	}