@charset "UTF-8";

/*----------------------------------------------------
	☆Uniq Common Rules
	
bgColor #FFFFF3
theme color #FFFFF3
sub color #FFFFF3
color #333
title color #7A99B2
link color #448EE3

masking layer color #fcfff0;

transition:.2s;
	
	
----------------------------------------------------*/
html {
  font-size: 62.5%;
}

body, h1, h2, h3, h4, h5, h6, pre, ul , ol , li, dl, dt, dd, p, img {
	margin:0;
	padding:0;
}

body {
	font-family: 'YuGothic', 'Yu Gothic','游ゴシック','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ','Meiryo',sans-serif;
	font-weight: 500;
	font-size: 13px;
	font-size: 1.3rem;
	color:#000;
	line-height:100%;
    animation: fadeIn 2.5s ease 0s 1 normal;
    -webkit-animation: fadeIn 2.5s ease 0s 1 normal;
}
@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}
@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}
* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
  }
.en{
	font-family: 'Poppins', sans-serif;
}
.en2{
	font-family: 'Sacramento', cursive;
}
.min{
	font-family: "YuMincho","Yu Mincho","ＭＳ Ｐ明朝","MS PMincho","ヒラギノ明朝 Pro W3","Hiragino Mincho Pro","serif";
}
a {
	color:#448EE3;
	text-decoration:underline;
	cursor:pointer;
	outline:none;
	-webkit-transition: .3s;
	-moz-transition: .3s;
	-o-transition: .3s;
	transition: .3s;
}

a:link {
	color:#448EE3;
	text-decoration:underline;
	outline:none;
}

a:hover {
	color:#448EE3;
	text-decoration:none;
	outline:none;
}

p {
	line-height:1.7;
}

ul, ol {
	list-style-type:none;
}

ul li, ol li, dl {
	line-height:1.7;
}

a:focus {
  outline: none;
}

h1, h2, h3, h4, h5, h6 {
	line-height:1.7;
}

::selection { background-color:#888; color: #FFFFF3; /* Safari */ }
::-moz-selection { background-color: #888; color: #FFFFF3; /* Firefox */ }


h1, h2, h3, h4, h5, h6, pre, li, dt, dd, th, td, p {
	font-size:100%;
}


/*----------------------------------------------------
	☆Icon
----------------------------------------------------*/

@font-face {
  font-family: 'icomoon';
  src:  url('/lib/font/icomoon.eot?43s8dd');
  src:  url('/lib/font/icomoon.eot?43s8dd#iefix') format('embedded-opentype'),
    url('/lib/font/icomoon.ttf?43s8dd') format('truetype'),
    url('/lib/font/icomoon.woff?43s8dd') format('woff'),
    url('/lib/font/icomoon.svg?43s8dd#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-home3:before {
  content: "\e902";
}
.icon-camera:before {
  content: "\e90f";
}
.icon-mic:before {
  content: "\e91e";
}
.icon-book:before {
  content: "\e91f";
}
.icon-twitter:before {
  content: "\ea96";
}



/*----------------------------------------------------
	☆Crearfix
----------------------------------------------------*/

.clearfix:after {
	content:".";
	height:0;
	clear:both;
	display:block;
	font-size:0.1em;
	line-height:0;
	visibility:hidden;
}
.clearfix {
	display:inline-block;
	min-height:1%;
}
/* Hides from IE-mac \*/
* html .clearfix {height:1%;}
/* End hide from IE-mac */


/*----------------------------------------------------
	☆br clear
----------------------------------------------------*/

br.clear_noie {
	display:inline !important;
	display:none;
	clear:both;
	line-height:0px;
}
br.clear_all {
	clear:both;
	line-height:0px;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
br.clear_noie  {
	display:block!important;
	content: " ";
}
}
div.clear_noie {
	clear:both;
	line-height:0px;
}

/*----------------------------------------------------
	☆topcontrol
----------------------------------------------------*/
#topcontrol {
	z-index:100;
}
#topcontrol a {
	background:url(../cmn_js/scrolltop/scrollup.png) center center no-repeat;
	background : url(../cmn_js/scrolltop/scrollup.gif) center center no-repeat\9; /* IE8 and below */
	*background : url(../cmn_js/scrolltop/scrollup.gif) center center no-repeat; /* IE7 and below */
	_background : url(../cmn_js/scrolltop/scrollup.gif) center center no-repeat; /* IE6 */
	font-size:0;
	display:block;
	height:60px;
	width:60px;
	background-size:50px 50px;
	opacity:0.7;
	-webkit-transition: all .15s ease-in-out;
	transition: all .15s ease-in-out;
}


#topcontrol a:hover {
	background-size:60px 60px;
	opacity:1;
}



/*----------------------------------------------------
	☆Display None
----------------------------------------------------*/

#sample{
	display:none;
	visibility:hidden;
}




/*----------------------------------------------------
	☆base contents
----------------------------------------------------*/


/*cmn*/
#container .readTx{
	font-size: 14px;
	text-align: center;
	line-height: 2;
	margin-bottom: 80px;
}


/*--MV--*/
#head .h2{
	padding:140px 0 80px 0;
	text-align: center;
	font-weight: 300;
}
#head .h2{
	font-size: 32px;
	letter-spacing: 0.1em;
	line-height: 1;
}
#head .h2 span{
	font-size: 14px;
	margin-top: 8px;
	display: block;
}
#head .mv{
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	padding-top: 18.5714%;
	width: 100%;
}


/*-- HEADER --*/

#hd{
	position:fixed;
	top:0;
	left: 50%;
  transform:translateX(-50%);
  -webkit- transform:translateX(-50%);
	width: 100%;
	height: auto;
	background-color: #fff;
	z-index: 99;
}
#hd .gnavArea{
	width: calc(100% - 40px);
	width: -webkit-calc(100% - 40px);
	margin: 0 auto;
	padding: 20px 0;
	font-size: 0;
}
#hd.shadow {
    box-shadow: 1px 1px 5px rgba(0,0,0,0.3);
    　 -moz-box-shadow: 1px 1px 5px rgba(0,0,0,0.3);
    　 -webkit-box-shadow: 1px 1px 5px rgba(0,0,0,0.3);
    　 -moz-transition: .3s;
    -o-transition: .3s;
    transition: .3s;
	z-index: 999;
}
#hd .gnavArea .hdLogo{
	display: inline-block;
	vertical-align: middle;
	width: 10%;
}
#hd .gnavArea .hdLogo img{
	width: 111px;
	height: auto;
}
#hd .gnavArea .gnavList{
	display: inline-block;
	vertical-align: middle;
	text-align: right;
	width: 90%;
}
#hd .gnavArea .gnavList > li{
	display: inline-block;
	vertical-align: middle;
}
#hd .gnavArea .gnavList > li a{
	font-size: 13px;
	color: #111;
	text-decoration: none;
	margin-left: 40px;
	letter-spacing: 0.1em;
	position: relative;
  display: inline-block;
}
#hd .gnavArea .gnavList > li.contact a{
	padding:10px 0 10px 38px;
	background-image: url(../cmn_img/icon01.png);
	background-size: 31px 31px;
	background-position: center left;
	background-repeat: no-repeat;
}
#hd .gnavArea .gnavList > li.insta a{
	margin-left: 30px;
	padding-left: 30px;
	position: relative;
}
#hd .gnavArea .gnavList > li.insta a::before{
	content: "";
	background-color: #b8b8b8;
	width: 1px;
	height: 10px;
	top: 12px;
	left: 0;
	position: absolute;
}
#hd .gnavArea .gnavList > li.insta a:hover{
	opacity: 0.5;
}
#hd .gnavArea .gnavList > li.insta img{
	width: 31px;
	height: 31px;
}
#hd .gnavArea .gnavList > li a::after {
  position: absolute;
  bottom: -4px;
  left: 0;
  content: '';
  width: 100%;
  height: 2px;
  background: #333;
  transform: scale(0, 1);
  transform-origin: center top;
  transition: transform .3s;
}
#hd .gnavArea .gnavList > li.insta a::after{
	display: none;
}
#hd .gnavArea .gnavList > li a:hover::after {
  transform: scale(1, 1);
}
/*----*/
#spHd .hdLogoSp img{
	 line-height:0;
	width: 110px;
	height: auto;
	margin: 12px 0 10px 10px;
}
nav.globalMenuSp {
    position: fixed;
    z-index: 998;
    top: 0;
    left: 0;
    background: #fff;
    color: #000;
    text-align: center;
    transform: translateY(-100%);
    transition: all 0.6s;
    width: 100%;
}
 
nav.globalMenuSp ul {
    background: #ccc;
    margin: 0 auto;
    padding: 0;
    width: 100%;
}
 
nav.globalMenuSp ul li {
    font-size: 1.1em;
    list-style-type: none;
    padding: 0;
    width: 100%;
    border-bottom: 1px dotted #333;
}
 
/* 最後はラインを描かない */
nav.globalMenuSp ul li:last-child {
    padding-bottom: 0;
    border-bottom: none;
}
 
nav.globalMenuSp ul li a {
    display: block;
    color: #000;
    padding: 1.5em 0;
	text-decoration: none;
}
 
/* このクラスを、jQueryで付与・削除する */
nav.globalMenuSp.active {
    transform: translateY(0%);
}
.navToggle {
    display: block;
    position: fixed;    /* bodyに対しての絶対位置指定 */
    right: 13px;
    top: 8px;
    width: 42px;
    height: 51px;
    cursor: pointer;
    z-index: 999;
    /*background: #666;*/
    text-align: center;
}
 
.navToggle span {
    display: block;
    position: absolute;    /* .navToggleに対して */
    width: 26px;
    border-bottom: solid 2px #111;
    -webkit-transition: .35s ease-in-out;
    -moz-transition: .35s ease-in-out;
    transition: .35s ease-in-out;
    left: 6px;
}
 
.navToggle span:nth-child(1) {
    top: 9px;
}
 
.navToggle span:nth-child(2) {
    top: 18px;
}
 
.navToggle span:nth-child(3) {
    top: 27px;
}
 
.navToggle span:nth-child(4) {
    border: none;
    color: #111;
    font-size: 9px;
    font-weight: 500;
    top: 34px;
	font-family: 'Poppins', sans-serif;
	letter-spacing: 0.1em;
}
/* 最初のspanをマイナス45度に */
.navToggle.active span:nth-child(1) {
    top: 18px;
    left: 6px;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
 
/* 2番目と3番目のspanを45度に */
.navToggle.active span:nth-child(2),
.navToggle.active span:nth-child(3) {
    top: 18px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
}

/*-- FOOTER --*/
footer#ft{
	background-color: #00122e;
	padding: 30px 0;
}
footer#ft .boxL{
	width: 10%;
	display: inline-block;
	vertical-align: middle;
}
footer#ft .boxL .ftLogo img{
	width: 82px;
	height: auto;
}
footer#ft .boxR{
	width: 88%;
	display: inline-block;
	vertical-align: middle;
}
footer#ft .boxR .siteaMapList{
	text-align: right;
}
footer#ft .boxR .siteaMapList > li{
	display: inline-block;
}
footer#ft .boxR .siteaMapList > li a{
	color: #fff;
	text-decoration: none;
	padding: 0 25px;
	position: relative;
	display: block;
	font-size: 12px;
	letter-spacing: 0.1em;
}
footer#ft .boxR .siteaMapList > li a:hover{
	opacity: 0.5;
}
footer#ft .boxR .siteaMapList > li a::before{
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%) ;
	-webkit- transform: translateY(-50%);
	height: 8px;
	width: 1px;
	background-color: #c0c0c0;
}
footer#ft .boxR .siteaMapList > li.navLast a::after{
	content: "";
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%) ;
	-webkit- transform: translateY(-50%);
	height: 8px;
	width: 1px;
	background-color: #c0c0c0;
}
footer#ft .boxR .siteaMapList > li.insta a{
	font-size: 10px;
	padding:13px 0 13px 45px;
	background-image: url(../cmn_img/ft_icon01.png);
	background-repeat: no-repeat;
	background-position: left center;
	background-size: 40px 40px;
	margin-left: 15px;
}
footer#ft .boxR .siteaMapList > li.insta a::before{
	display: none;	
}
footer#ft .boxR .copyRight{
	font-size: 10px;
	color: #798392;
	text-align: right;
	letter-spacing: 0.1em;
	margin-top: 10px;
}



/*--lineUp--*/
ul.menuList{
	width: 100%;
}
ul.menuList li.slick-slide{
	border-left: 1px solid #e2e2e2;
	border-bottom: 1px solid #e2e2e2;
	border-top: 1px solid #e2e2e2;
}
/*
#lineUp .sliderArea ul.menuList li.last.slick-slide{
	border-right: 1px solid #e2e2e2;	
}*/
ul.menuList li.slick-slide .imgBase{
	position: relative;
    width: 100%;
    padding-top: 100%;
    overflow: hidden;
}
ul.menuList li.slick-slide .imgBase>img{
	position:absolute;
	width: auto;
    height: auto;
    top: 50%;
    left: 50%;
    min-height: 100%;
    min-width: 100%;
    -ms-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
	-webkit-transition: .3s;
	-moz-transition: .3s;
	-o-transition: .3s;
	transition: .3s;
}
@supports ( object-fit: cover ) {
ul.menuList li.slick-slide .imgBase>img {
        height: 100%;
        width: 100%;
        left: 0;
        -o-object-fit: cover;
        object-fit: cover;
        top: 0;
        -ms-transform: none;
        -moz-transform: none;
        -webkit-transform: none;
        transform: none;
    }
}
ul.menuList li.slick-slide .imgBase>img.default{
	z-index: 10;
}
ul.menuList li.slick-slide .imgBase>img.mouse_on{
	z-index: 9;
}
ul.menuList li.slick-slide:hover .imgBase>img.default{
	opacity:0;
}
ul.menuList li.slick-slide .imgBase{
	width: 100%;
	padding-top: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
ul.menuList li.slick-slide .imgBase .recommendTag{
	top: 0;
	left: 0;
	background-image: url(/lib/cmn_img/lineup_icon.png);
	background-position: top left;
	background-size: 49px 49px;
	z-index: 99;
	position: absolute;
	width: 49px;
	height: 49px;
}

ul.menuList li.slick-slide{
	color: #111;
	text-decoration: none;
}
ul.menuList li.slick-slide .txBox{
	padding: 20px;
	background-color: #fff;
	word-wrap: break-word;
    overflow-wrap: break-word;
}
ul.menuList li.slick-slide .txBox h4.h4{
	font-size: 16px;
	text-align: center;
	font-weight: 500;
}
ul.menuList li.slick-slide .txBox .infoTx{
	font-size: 13px;
	margin-top: 5px;
	/*padding-bottom: 15px;
	border-bottom: 1px dashed #d3d3d3;
	margin-bottom: 15px;*/
	width: 100%;
}
ul.menuList li.slick-slide .txBox .price{
	font-size: 22px;
	text-align: center;
}
ul.menuList li.slick-slide .txBox .price span{
	font-size: 13px;
}




/*デバイスの横幅が760px以下の場合*/
@media only screen and (max-width: 760px) {

body{
	font-size: 12px;
	font-size: 1.2rem;
}
/*-- HEADER --*/
	
	
	
/*-- FOOTER --*/
	
footer#ft .boxL{
	width:100%;
	text-align: center;
	margin-bottom: 15px;
}
footer#ft .boxR{
	width: 100%;
	display:block;
}
	footer#ft .boxR .siteaMapList{
		text-align: center;
		font-size: 0;
	}
	footer#ft .boxR .siteaMapList > li{
		width: 33.33%;
		margin-bottom: 5px;
		text-align: center;
	}
footer#ft .boxR .siteaMapList > li a{
	padding: auto;
	width: 100%;
}
footer#ft .boxR .siteaMapList > li a::before{
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%) ;
	-webkit- transform: translateY(-50%);
	height: 8px;
	width: 1px;
	background-color: #c0c0c0;
}
footer#ft .boxR .siteaMapList > li:nth-child(3n) a::after{
	content: "";
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%) ;
	-webkit- transform: translateY(-50%);
	height: 8px;
	width: 1px;
	background-color: #c0c0c0;
}
footer#ft .boxR .copyRight{
	text-align: center;
}

/*-- lineUp --*/
	
ul.menuList li.slick-slide .txBox{
	padding: 15px;
}
ul.menuList li.slick-slide .txBox h4.h4{
	font-size: 14px;
}
ul.menuList li.slick-slide .txBox .infoTx{
	font-size: 13px;
	padding-bottom: 12px;
	margin-bottom: 12px;
}
ul.menuList li.slick-slide .txBox .price{
	font-size: 18px;
}
ul.menuList li.slick-slide .txBox .price span{
	font-size: 12px;
}	
	
	
/*cmn*/
#container .readTx{
	font-size: 13px;
	margin-bottom: 40px;
}

	
/*--MV--*/
#head .h2{
	padding:60px 0 60px 0;
}
#head .h2{
	font-size: 28px;
}
#head .h2 span{
	font-size: 14px;
}
#head .mv{
	padding-top:40%;
}
}