#header_main {
	position: relative;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9afcf', endColorstr='#f9afcf',GradientType=1 );
	color: #fff;
	text-align: center;
}

#getintouch {
	position:fixed;
	border:0px solid;
	width:12px;
	height:107px;
	left:70px;
	top:48%;
	margin:-53px 0 0;
	padding:0;
}
#getintouch img {
	vertical-align:top;
}
.getintouchtxt {
	border:0px solid;
	position:fixed;
	top: 48%;
	left: -330px;
	margin: -140px 0 0;
}

#gnbWrap {
	position: fixed;
	bottom:0;
	left:0;
	width:100%;
	height:185px;
	/*padding-left:3%;
	padding-right:3%;*/
	border:0px solid;
}
#gnbWrap:before {
	content: '';
	display:block;
	position:absolute;
	top:102px;
	width:100%;
	background-color:#fff;
	opacity: 0.2;
	height:1px;
}
#gnbWrap > ul.gnb {
	border:0px solid red;
	margin-left:0;
	margin-right:0;
}
#gnbWrap > ul.gnb > li { 
	float: left;
	width: 25%;
	text-align: center;
	font-family: 'Uni Sans Thin CAPS';
	font-weight: bold;
	font-size: 24px;
	letter-spacing: 5px;
	color: rgba(255,255,255,1);
	padding: 0 0 23px;
	height: 103px;
	position: relative;
	bottom: 0;
	border-bottom: 0px solid #fff;
	transition: all .3s;
}
#gnbWrap > ul.gnb > li > a { 
	position:absolute;
	bottom: 23px;
	left: 50%;
	transform: translateX(-50%);
}
#gnbWrap > ul.gnb > li:hover {
	border-bottom:1px solid #fff;
	transition:all .3s;
}
#gnbWrap > ul.gnb > li:hover > a { 
	color: rgba(255,255,255,1);
	font-size: 48px;
	font-family: 'Uni Sans Regular';
	letter-spacing: 10px;
	bottom: 40px;
	transition:all .3s;
}
#gnbWrap > ul.gnb > li:hover > a:after { 
	content: "";
	position: absolute;
	top: -20px;
	left: 50%;
	width: 10px;
	height: 10px;
	margin: 0 0 0 -9px;
	border-radius: 100%;
	background: #fd4c7e;
}
/*#gnbWrap > ul.gnb > li:hover:nth-of-type(2) > a:after { 
	background: #a80e38;
}
#gnbWrap > ul.gnb > li:hover:nth-of-type(3) > a:after { 
	background: #fd4c7e;
}
#gnbWrap > ul.gnb > li:hover:nth-of-type(4) > a:after { 
	background: #f87210;
}*/
#gnbWrap ul.gnb li ul.gnb2 {
	display:none;
	height:40px;
}
#gnbWrap ul.gnb li:hover ul.gnb2 {
	display:block;
	position:absolute;	
	border:0px solid blue;
	top:100px;
	left: 50%;
	padding:30px 0 30px 0;
	transition:all .2s;
	/*border:1px solid red;*/
}
#gnbWrap ul.gnb li:first-child ul.gnb2 { 
	left:42%; width:720px;
}
#gnbWrap ul.gnb li:nth-child(2) ul.gnb2 { 
	left:42%; width:370px;
}
#gnbWrap ul.gnb li:nth-child(3) ul.gnb2 { 
	left:42%; width:720px;
}
#gnbWrap ul.gnb li:last-child ul.gnb2 { 
	left:-42%; width:650px;
}
#gnbWrap ul.gnb li ul.gnb2 li {
	float:left;
	margin:0 0 0 20px;
}
#gnbWrap ul.gnb li ul.gnb2 li a {
	color: rgba(255,255,255,1);
	font-size:20px;
	font-weight: normal;
	font-family: "SpR";
	letter-spacing:0;
	padding:0 15px 30px 10px;
}

#gnbWrap ul.gnb li ul.gnb2 li a:hover {
	
}

#btnsWrap {
	position:relative;
	width:100%;
}
#btnsWrap .btns {
	position:fixed;
	right:50px;
	top:48%;
	margin: -105px 0 0;
}
#btnsWrap .btns li {
	margin:10px 0;
	border:0px solid;
	text-align:right;
}
.tablet_quick,
.tablet_bg,
.quick_basket span.close
{
    display:none;
}

img.getintouch-mobile, img.getintouch-text-mobile {
	display: none;
}

img.getintouch-pc, img.getintouch-text-pc {
	display: block;
}

.mobile-visual, .owl-carousel, .owl-carousel .owl-nav, .owl-carousel .owl-dots {
	display: none;
}

/* Feel free to change duration  */ 
.animated  {
  -webkit-animation-duration : 1000 ms  ;
  animation-duration : 1000 ms  ;
  -webkit-animation-fill-mode : both  ;
  animation-fill-mode : both  ;
}  
/* .owl-animated-out - only for current item */ 
/* This is very important class. Use z-index if you want move Out item above In item */ 
.owl-animated-out {
  z-index : 1 
   }
/* .owl-animated-in - only for upcoming item
/* This is very important class. Use z-index if you want move In item above Out item */ 
.owl-animated-in {
  z-index : 0 
   }
/* .fadeOut is style taken from Animation.css and this is how it looks in owl.carousel.css:  */ 
.fadeOut  {
  -webkit-animation-name : fadeOut  ;
  animation-name : fadeOut  ;
}  
@-webkit-keyframes  fadeOut  {
  0% {
    opacity : 1   ;
  }  
  100% {
    opacity : 0   ;
  }  
}
@keyframes  fadeOut  {
  0% {
    opacity : 1   ;
  }  
  100% {
    opacity : 0   ;
  }  
}

@media screen and (max-width: 1400px) {
	#getintouch {
		left: 50px;
	}
}


@media screen and (max-width: 1024px) {
	#getintouch, #gnbWrap {
		display:none;
	}
}

@media only screen 
and (min-device-width : 1024px) 
and (max-device-width : 1366px) 
and (orientation : portrait) {
	.backstretch {
		display: none;
	}
	.mobile-visual {
		display: block;
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh;
		background: url(../img/main_img01_mobile.jpg) no-repeat 66% 50%;
		background-size: cover;
		z-index: -1;
	}
	.mobile-text {
		position: absolute;
		bottom: 100px;
		left: 90px;
	}
	.mobile-text h2 {
		color: #fff;
		font-family: "SpL";
	}
	.mobile-text h2 span {
		font-family: "SpB";
	}
	.mobile-text h2 > div {
		font-size: 25px;
		letter-spacing: -0.05em;
	}
	.mobile-text h2 > div + div {
		margin: 5px 0 0;
		font-family: "Uni Sans Heavy";
		font-size: 110px;
		letter-spacing: 0.06em;
		line-height: normal;
	}
	.mobile-text h2 > div + div + div {
		margin: -10px 0 0;
		font-family: "SpL";
		font-size: 44px;
		letter-spacing: -0.07em;
		line-height: 30px;
	}
	.mobile-text h2 > div + div + div span {
		font-family: "SpR";
	}

	#getintouch {
		display: block;
		top: 50%;
		left: 35px;
	}
	
	.getintouchtxt {
		top: 50%;
	}

	img.getintouch-mobile, img.getintouch-text-mobile {
		display: block;
	}

	img.getintouch-mobile {
		width: 12px;
	}

	img.getintouch-text-mobile {
		width: 260px;
	}

	img.getintouch-pc, img.getintouch-text-pc {
		display: none;
	}
}

@media screen and (max-width: 812px) {
	.backstretch {
		display: none;
	}
	
	#header_main .top-area {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height:71px;
		z-index: 5;
	}

	#header_main .top-area.active {
		height: 86px;
		background: #fff;
	}

	#header_main .top-area #menu-body {
		max-height: 450px;
	}

	#header_main .top-area #menu-body > ul {
		top: 71px;
	}
	.mobile-visual {
		display: block;
		position: relative;
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh;
		background: url(../img/main_img01_mobile.jpg) no-repeat 66% 50%;
		background-size: cover;
		z-index: -1;
	}
	.mobile-visual.mobile-visual-02 {
		background: url(../img/main_img02_mobile.jpg) no-repeat 65% 50%;
		background-size: cover;
	}
	.mobile-visual.mobile-visual-03 {
		background: url(../img/main_img03_mobile.jpg) no-repeat 70% 50%;
		background-size: cover;
	}
	.mobile-visual.mobile-visual-04 {
		background: url(../img/main_img04_mobile.jpg) no-repeat 69% 50%;
		background-size: cover;
	}
	.mobile-text {
		position: absolute;
		bottom: 80px;
		left: 90px;
	}
	.mobile-text h2 {
		color: #fff;
		font-family: "SpL";
	}
	.mobile-text h2 span {
		font-family: "SpB";
	}
	.mobile-text h2 > div {
		font-size: 16px;
		letter-spacing: -0.05em;
	}
	.mobile-text h2 > div + div {
		margin: 5px 0 0;
		font-family: "Uni Sans Heavy";
		font-size: 70px;
		letter-spacing: 0.06em;
		line-height: normal;
	}
	.mobile-text h2 > div + div + div {
		margin: -10px 0 0;
		font-family: "SpL";
		font-size: 28px;
		letter-spacing: -0.07em;
		line-height: 30px;
	}
	.mobile-text h2 > div + div + div span {
		font-family: "SpR";
	}
	.btns {
		display:none;
	}
	.tablet_quick .common_go_top img {
		width: 58px;
	}
	.quick_menu ul li img {
		width: 62px;
	}

    /* 00.°ψΕλ */
    .quick_basket span.close
    {
        display:block;
        position:relative;
        width:14px;
        height:14px;
    }
    .quick_basket span.close
    {
        display:block;
        position:relative;
        width:14px;
        height:14px;
        float:right;
        cursor:pointer;
    }
    .quick_basket span.close:before
    {
        transform:rotate(-495deg)
    }
    .quick_basket span.close:after
    {
        transform:rotate(-405deg)
    }
    .quick_basket span.close:before,
    .quick_basket span.close:after
    {
        content:"";
        position:absolute;
        top:6px;
        right:0;
        width:14px;
        height:2px;
        background-color:#000000;
    }

    .fixed_right
    {
        display:none
    }
    .tablet_bg
    {
        position:fixed;
        top:0;
        left:0;
        width:100%;
        height:100vh;
        background:rgba(0,0,0,0.6);
        z-index:3;
    }
    .tablet_quick
    {
        display:block;
        position:fixed;
        bottom:20px;
        right:20px;
        z-index:4;
    }
    .btn_quick
    {
        display:block;
        position:relative;
        width:40px;
        height:40px;
        background:#5e20b2;
        border-radius:100%;
    }
	.btn_quick.active 
	{
		background: #fff;
	}
    .btn_quick::before, .btn_quick::before, .btn_quick::after
    {
        position:absolute;
        left:13px;
        top:19px;
        width:14px;
        height:1px;
        background-color:#fff;
        content:"";
        -webkit-transition:all .25s cubic-bezier(.17,.67, .83, .67);
        transition:all .25s cubic-bezier(.17,.67, .83, .67);
    }
    .btn_quick::after
    {
        -webkit-transform:rotate(90deg);
        transform:rotate(90deg);
    }
	.btn_quick.active::before, .btn_quick.active::after
	{
		background-color: #000;
	}
    .btn_quick.active::before
    {
		color: #000;
        -webkit-transform:rotate(-495deg);
        transform:rotate(-495deg);
    }
    .btn_quick.active::after
    {
		color: #000;
        -webkit-transform:rotate(-405deg);
        transform:rotate(-405deg);
    }
    .tablet_quick .common_go_top
    {
        display:none;
    }
    .tablet_quick .common_go_top img
    {
        width:40px;
    }

    .quick_menu
    {
        /* overflow:hidden; */
        visibility:hidden;
    }
    .quick_menu.show
    {
        visibility:visible;
    }
    .quick_menu ul li
    {
        position:relative;
        visibility:hidden;
        opacity:0;
        height:0;
        transition:all .3s;
    }
    .quick_menu.show ul li
    {
        visibility:visible;
        height:52px;
        opacity:1;
    }
    .quick_menu ul li a
    {
        display:block
    }
    .quick_menu ul li span
    {
        position:absolute;
        top:36%;
        transform:translateY(-50%);
        left:-49px;
        font-size:12px;
        color:#fff;
        letter-spacing:-0.05em;
	}
	.quick_menu_en ul li span
	{
		left:-100px;
	}
    .quick_menu_en ul li span
    {
        left:-105px !important;
    }
    .quick_menu_en ul li span
    {
        left:-97px !important
	}
	.quick_menu_en ul li:nth-child(3) span
	{
		left:-143px !important;
	}
    .quick_menu ul li:nth-child(3) span
    {
        /*left:-60px*/
    }
    .quick_menu ul li img
    {
        width:40px;
    }

	#getintouch {
		display: block;
		top: 50%;
		left: 35px;
	}
	
	.getintouchtxt {
		top: 50%;
	}

	img.getintouch-mobile, img.getintouch-text-mobile {
		display: block;
	}

	img.getintouch-mobile {
		width: 12px;
	}

	img.getintouch-text-mobile {
		width: 260px;
	}

	img.getintouch-pc, img.getintouch-text-pc {
		display: none;
	}
}

@media screen and (max-width: 680px) {
	.mobile-visual {
		background-position: 50% 30%;
	}
	.mobile-text {
		left: 80px;
	}
	.mobile-text h2 > div {
		font-size: 12px;
		letter-spacing: -0.05em;
	}
	.mobile-text h2 > div + div {
		margin: 5px 0 0;
		font-size: 50px;
		letter-spacing: 0.06em;
		line-height: auto;
	}
	.mobile-text h2 > div + div + div {
		margin: -10px 0 0;
		font-size: 20px;
		letter-spacing: -0.07em;
		line-height: 30px;
	}
}

@media screen and (max-width: 500px) {
	.mobile-visual {
		background-position: 56% 50%;
	}
	.mobile-text {
		bottom: 31px;
		left: 36px;
	}
}

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

	#header_main .top-area #menu-body {
		max-height: 450px;
	}
}

@media screen and (max-height: 812px) {

	#header_main .top-area #menu-body {
		max-height: 656px;
	}
}
@media screen and (max-height: 736px) {

	#header_main .top-area #menu-body {
		max-height: 577px;
	}
}
@media screen and (max-height: 667px) {

	#header_main .top-area #menu-body {
		max-height: 520px;
	}
}
@media screen and (max-height: 640px) {

	#header_main .top-area #menu-body {
		max-height: 490px;
	}
}
