@charset "utf-8";
@import url(reset.css);



/* nanum-gothic-regular - latin */
@font-face {
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/nanum-gothic-v9-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('NanumGothic'),
       url('../fonts/nanum-gothic-v9-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/nanum-gothic-v9-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/nanum-gothic-v9-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/nanum-gothic-v9-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/nanum-gothic-v9-latin-regular.svg#NanumGothic') format('svg'); /* Legacy iOS */
}
/* nanum-gothic-700 - latin */
@font-face {
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/nanum-gothic-v9-latin-700.eot'); /* IE9 Compat Modes */
  src: local('NanumGothic Bold'), local('NanumGothic-Bold'),
       url('../fonts/nanum-gothic-v9-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/nanum-gothic-v9-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/nanum-gothic-v9-latin-700.woff') format('woff'), /* Modern Browsers */
       url('../fonts/nanum-gothic-v9-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/nanum-gothic-v9-latin-700.svg#NanumGothic') format('svg'); /* Legacy iOS */
}


/* roboto-100italic - latin */
/* roboto-100 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 100;
  src: url('../fonts/roboto-v18-latin-100.eot'); /* IE9 Compat Modes */
  src: local('Roboto Thin'), local('Roboto-Thin'),
       url('../fonts/roboto-v18-latin-100.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/roboto-v18-latin-100.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto-v18-latin-100.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto-v18-latin-100.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/roboto-v18-latin-100.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-regular - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/roboto-v18-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Roboto'), local('Roboto-Regular'),
       url('../fonts/roboto-v18-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/roboto-v18-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto-v18-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto-v18-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/roboto-v18-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */
}
/*----------------------------------------------------------------------------------*/

/*-----------------------------------------------------header*/
body {
    max-width:1900px;
    background: url(../img/common/Untitled-1.png)repeat;
}
header{
    width:100%;
}
header>#head {
    width:100%; /*1272px */
}

header>#head>.head_top{
    width:100%;
    height:92px;
    /*position:relative;*/
    position:fixed;
    top:0;
    background: url(../img/common/Untitled-1.png)repeat;
    z-index:999;
}


header>#head>.head_top>.head_logo {
    padding-left:324px;
    padding-top:20px;
    float:left;
}
header>#head>.head_top h1>a>img {
    width:237px;
    line-height:92px;
}
header>#head >.head_top h1>span {
    font-size:0;
}

#head>.head_top>.head_menu{
    float:right;
    padding-right:324px;
}
#head>.head_top>.head_menu>ul>li{
    float:left;
    width:50px; 
    margin:20px 0;
    margin-left:20px;
    
}
#head>.head_top>.head_menu>ul>li a {
    display:block;
}
#head>.head_top>.head_menu>ul>li a span {
    display:block;
    font:11px/1.5 "roboto";
    color:#7e6144;
    width:100%;
    text-align:center;
    padding:0;
}
#head>.head_top>.head_menu>ul>li img,#head>.head_menu>ul>li img {
   display:block; 
}

#head>.head_top>.head_menu>ul>li :hover span {
    color:#65abce;
}
/*---------------------------------------------------------.allmenu*/
/*.allmenu {
    width:100%;
    height:100%;
    position:fixed;
    top:0;
    left:0;
    background:#fff;
    z-index:999999;
    
	overflow-y:scroll;
}*/
.allmenu_wrap {
    width:100%;     /*1272px;*/
    height:100%;
    padding-top:100px;
    /*position:relative;*/
	display:none;
	background:#fff;
	position:fixed;
    top:0;
    left:0;
	z-index:9999;
}
.allmenu_wrap.overlay.overlay-cornershape {
	display:block;
}
.allmenu_wrap>.menu_close {
    width:50px;
    position:absolute;
    top:70px;
    right:600px;
}

.allmenu_wrap>ul {
    position:absolute;
    top:60px;
    left:600px;
	margin-top:100px;
}

.allmenu_wrap>ul>li>a {
    font:50px/1.5 "roboto";
    color:#65abce;
    font-weight:400;
    text-align:center;
    
    
}
.allmenu_wrap>ul>li:hover a{
    
}
.allmenu_wrap>ul>.all_depth:hover >a {
    color:#7d426c;
    border-bottom:5px solid #65abce;
}
.allmenu_wrap>ul>.all_depth>.all_depth1 {
    padding-top:10px;
}
.allmenu_wrap>ul>.all_depth>.all_depth1>li {
    padding:5px 0;
}
.allmenu_wrap>ul>.all_depth>.all_depth1>li>a {
    color:#65abce;
    font-size:18px;
    font-family: 'Nanum Gothic';
    font-style: normal;
    font-weight: 400;
    
}
.allmenu_wrap>ul>.all_depth>.all_depth1>li:hover >a {
    color:#7d426c;

}
.all_depth1 {
    display:none;
}


.allmenu_wrap>ul>.all_depth>.all_depth1>.more>button>a {
    display:block;
    border:1px solid #65abce;
    padding:10px;
    color:#65abce;
    font-size:18px;
    font-family: 'Nanum Gothic';
    font-style: normal;
    font-weight: 400;
    margin-top:10px;
}

.allmenu_wrap>ul>.all_depth>.all_depth1>.more>button:hover >a {
    color:#fff;
    border:1px solid #7d426c;
    background: #7d426c;
}






/*==================================================================head slide*/

.slide {
    max-width:1900px;
    margin:0 0 142px 0;
    position:relative;
    top:92px;
    left:0;
}

.slide>.arrow >.mouse img {
    display:block;
    width:3.01%;
    position:absolute;
    bottom:50px;
    left:50%;
    margin-left:-25.5px; 
}
.slide>.arrow>.mouse>.mouse_ani{
    animation:m_ani 1.5s infinite;
    transition:all 1.5s ease-in-out;
}

@keyframes m_ani {
    from {bottom:30px;}
    to {bottom:5px;}
}


/*======================================================================gnb영역*/


#gnb {
    width:100%;
    height:30px;
    background:#65abce; 
    margin-top:50px;
    
}

#gnb>.gnb_wrap{
    max-width:1272px; 
    margin:0 auto;
    position:relative;
}


#gnb>.gnb_wrap>ul {
    float:left;
    width:14.28571%;
    text-align:center;
}
#gnb>.gnb_wrap>ul>.depth{
    width:100%;
}
#gnb>.gnb_wrap>ul>.depth>a{
    display:block;
    width:100%;
    /*background: #ccc;*/
    color:#fff;
    font:14px/30px "roboto";
    font-weight:400;
    position:relative;
}
#gnb>.gnb_wrap>ul:hover >.depth>a::after {
    content:'';
    width:0;
    height:0;
    border-top:8px solid #7d426c;
    border-left:8px solid transparent;
    border-right:8px solid transparent;
    position:absolute;
    bottom:-8px;
    left:50%;
    margin-left:-4px;
    z-index:1005;
    text-align:center;
}

#gnb>.gnb_wrap>ul>li:hover >a{
    color:#7d426c;
}
#gnb>.gnb_wrap .gnb_sub{
    width:100%;
    height:230px;
    position:absolute;
    left:0;
    background: url(../img/common/Untitled-1.png)repeat;
    display:none;
}
.gnb_sub >.depth1,.gnb_sub >.depth2 {
    text-align:left;
    padding-left:60px;
    padding-top:20px; 
    float:left;

}

.gnb_sub >.depth1>li,.gnb_sub >.depth2>li {
    margin:10px 0;
    color:#65abce;
    font-size:13px;
    font-family: 'Nanum Gothic';
    font-style: normal;
    font-weight: 400;
    padding-bottom:5px;
}

.gnb_sub> .depth_close {
    width:45px;
    position:absolute;
    right:30px;
    bottom:30px;
}
.gnb_sub >.depth1>li:hover >a,.gnb_sub >.depth2>li:hover >a {
    color:#7d426c;
    border-bottom:2px solid #7d426c;
    padding-bottom:5px;

}

.depth_box {
    position:absolute;
    right:100px;
}
.depth_box >img {
    display:block;
    float:left;
    margin-left:20px;
    padding-top:32px;
    
}

/*-----------------------------------------------------------------------gnb_cafe*/
.cafelist>div {
    width:20%;
    display:inline-block;
    margin-top:20px;
}
.cafelist>div>.depth1 {
    position:absolute;
    top:20px;
}
.cafelist>div>ul>li{
    padding-top:10px;
    padding-left:30px;
    color:#65abce;
    text-align:left;
    font-size:13px;
    font-family: 'Nanum Gothic';
    font-style: normal;
    font-weight: 400;
}
.cafelist>div>ul>li:hover >a{
    color:#7d426c;
    border-bottom:2px solid #7d426c;
    padding-bottom:5px;
}

/*----------------------------------------------------------------gnb_illust*/
.illust>ul {
    width:80%;
    margin:50px 100px; 
}
.illust>ul>li{
    float:left;
    width:25%;
    text-align:center;
    position:relative;
}

.illust>ul>li>a>img {
    width:120px;
    display:block;
    margin-left: 65px;
    margin-bottom:30px;
}

.illust>ul>li>a>span {
    display:block;
    font:14px/1.5 "roboto";
    color:#65abce;
    /*text-align:center;*/
}


.illust>ul>li:hover >a>span {
    color:#7d426c;
    padding-bottom:10px;
}

/*=====================================================@media screen====================================================================================================================================================*/

@media screen and (max-width: 1272px) {

/*-----------------------------------------------------.head_top*/
    
header>#head>.head_top>.head_logo {
    padding-left:10px;
}

#head>.head_top>.head_menu{
    padding-right:10px;
}
#head>.head_top>.head_menu>ul>li{
    float:left;
    width:50px; 
    margin:20px 0;
    margin-left:20px;
    
}
#head>.head_top>.head_menu>ul>li>a {
    display:block;
}
#head>.head_top>.head_menu>ul>li>a>span {
    display:block;
    font:11px/1.5 "roboto";
    color:#7e6144;
    width:100%;
    text-align:center;
    padding:0 0 0px 0;
}
#head>.head_top>.head_menu>ul>li img,#head>.head_menu>ul>li img {
   display:block; 
}

#head>.head_top>.head_menu>ul>li :hover span {
    color:#65abce;
}

.allmenu>.allmenu_wrap>.menu_close {
    top:10px;
    right:31.25%;
}
    .allmenu >.allmenu_wrap>ul {
   
    top:10px;
    left:31.25%;
}
}

@media screen and (max-width: 1024px) {
.illust>ul {
    width:100%;
    margin:25px 0px; 
}
    .illust>ul>li>a>img {
    /*width:120px;*/
    display:block;
    margin-left: 10px;
    margin-bottom:30px;
}
    
    .illust>ul>li>a>span{
        text-align:left;
        padding-left:10px;
    }
    .allmenu>.allmenu_wrap>.menu_close {
    top:10px;
    right:31.25%;
}
    .allmenu >.allmenu_wrap>ul {
   
    top:10px;
    left:31.25%;
}
}

@media screen and (max-width: 640px){
    #head > .head_top > .head_menu > ul > li:nth-child(1),
    #head > .head_top > .head_menu > ul > li:nth-child(2),
    #head > .head_top > .head_menu > ul > li:nth-child(3) {
        display: none;
    }

    #head > .head_top > .head_menu > ul > li:nth-child(4) > a > span {
        font-size: 0;
    }

    #head > .head_top > .head_menu > ul > li {
        margin: 30px 0 0 0;
        margin-left: 20px;
    }

    #gnb {
        display: none;
    }

    .allmenu > .allmenu_wrap > .menu_close {
        top: 10px;
        right: 10%;
    }

    .allmenu > .allmenu_wrap > ul {
        top: 10px;
        left: 10%;
    }
	
}