@charset "utf-8";
@import url(//use.fontawesome.com/releases/v5.7.2/css/all.css);

@import url(http://fonts.googleapis.com/earlyaccess/notosansjp.css);
@import url(https://fonts.googleapis.com/css?family=Rokkitt);


/*=====================================================================
//	reset
=====================================================================*/

* {
  padding: 0;
  margin: 0 auto;
  font-size: 96%;
}

html, body, span, applet, object, iframe, p,blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn,
em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, h1, h2, h3, h4, h5, h6,
b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas,
details, embed, figure, figcaption, footer, header, hgroup, menu, nav,
output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: none;
  font-style: normal;
  font-weight: normal;
  font-size: 100%;
  font-family: 'Noto Sans JP', "Hiragino Kaku Gothic ProN","メイリオ", sans-serif;
  line-height: 1.4;
  /*vertical-align: baseline !important;*/
}

ol, ul {list-style: none;}

/* circle cut */

.circle-img{
    border-radius: 50%;
    width:  100%;
    height: 100%;
}

main{
  overflow-x: hidden;
}

.rokkitt{
  font-family: "Rokkitt";
}

/*=====================================================================
//	clearfix
=====================================================================*/

.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}

.clearfix {
  min-height: 1px;
}

* html .clearfix {
  height: 1px;
  /*¥*/
  /*/
	height: auto;
	overflow: hidden;
	/**/
}

.both {clear: both;}

/*=====================================================================
//	mediaQuery default
=====================================================================*/

.sm-br{display: none;}

/*=====================================================================
//	hover
=====================================================================*/

a.hoverOpa:hover{
  filter: alpha(opacity=70);
  -webkit-opacity: 0.70;
  -moz-opacity: 0.70;
  opacity: 0.70;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}

a.hoverOpa img:hover{
  filter: alpha(opacity=70);
  -webkit-opacity: 0.70;
  -moz-opacity: 0.70;
  opacity: 0.70;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}

/*=====================================================================
//	bootstrap
=====================================================================*/

.navbar-light .navbar-toggler {
  border-color: rgba(0,0,0,0);
}

#navbarNav{
  height: 100vh;
}

form{
  display: inline !important;
}


/*=====================================================================
//	ec cube
=====================================================================*/
.ec-role{
  max-width: 960px !important;
}

.ec-newsRole{
  padding-top: 0 !important;
}

.ec-newsRole .ec-newsRole__news{
  border: none !important;
  padding: 0 !important;
}

.ec-newsRole .ec-newsRole__newsCloseBtn{
  background: #3d2c07;
}

.ec-layoutRole .ec-layoutRole__contents{
  max-width: 1000px !important;
}

.ec-layoutRole .ec-layoutRole__main {
  padding: 30px 0;
}

/*=====================================================================
// text
=====================================================================*/

.text-vertical-flex{
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Text color */
.text-color-red{color: #cb0e1a !important;}
.text-color-w{color: #FFFFFF !important;}
.text-color-gr{color: #494949 !important;}

/* Text　link color */
.text-color-w a{color: #FFFFFF !important;}
.text-color-w a:hover,
.text-color-w a:active{
  color: #b7b7b7 !important;
  text-decoration: underline;
}

/* Text weight */
.text-bold{font-weight: bold;}

/* Lead text */
.text-Leadtext12{font-size: 12px !important; line-height: 1.4 !important;}
.text-Leadtext16{font-size: 16px !important; line-height: 1.7 !important;}
.text-Leadtext18{font-size: 18px !important; line-height: 1.8 !important;}
.text-Leadtext20{font-size: 20px !important; line-height: 1.8 !important;}
.text-Leadtext24{font-size: 24px !important; line-height: 1.8 !important;}
.text-Leadtext28{font-size: 28px !important; line-height: 1.8 !important;}

/* block text */
.text-blocktext16{font-size: 16px !important; line-height: 1.2 !important;}
.text-blocktext18{font-size: 18px !important; line-height: 1.4 !important;}
.text-blocktext20{font-size: 20px !important; line-height: 1.6 !important;}

/* Title text */
.text-titletext30{font-size: 30px !important; line-height: 1.6 !important;}
.text-titletext45{font-size: 45px !important; line-height: 1.6 !important;}

.contents-title01{font-family: 'Noto Sans JP', sans-serif;}
.contents-sbutitle01{font-family: "Rokkitt";}


.text-title-slashs {
  font-size: 120%;
  position: relative;
  display: inline-block;
  padding: 0 80px;
  text-align: center;
}
.text-title-slashs:before{
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 50px;
  height: 1px;
  background-color: #3d2c07;
  -webkit-transform: rotate(-120deg);
  transform: rotate(-120deg);
}

.text-title-slashs:after{
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 50px;
  height: 1px;
  background-color: #3d2c07;
  -webkit-transform: rotate(-60deg);
  transform: rotate(-60deg);
}

.text-title-slashs:before {left:0;}
.text-title-slashs:after {right: 0;}


/*=====================================================================
//	contents bg
=====================================================================*/

.bg-color-w{background: #FFF !important;}
.bg-color-gray{background: #282727 !important; color: #FFF !important;}

.bg-img-kilt{background: url("../img/com/com-bg-kilt.gif") repeat;
}

/*=====================================================================
//	border
=====================================================================*/

.border-common-title{border-top:#f47900 solid 5px;}
.border-common-title-br{border-top:#3d2c07 solid 5px;}

.border-top-br1{border-top:#3d2c07 solid 1px;}
.border-top-or1{border-top:#f47900 solid 1px;}

.border-bottom-br1{border-bottom:#3d2c07 solid 1px;}
.border-bottom-gr1{border-bottom:#b7b7b7 solid 1px;}

.border-left-gr1{border-left:#b7b7b7 solid 1px;}

.border-tb-double-or{
  border-top: 6px double #f47900;
  border-bottom: 6px double #f47900;
  padding: 20px 0;
}

/*=====================================================================
//	list
=====================================================================*/

ul li {
  line-height: 1.5;
  padding: 0.2em 0;
}

ul.list-flow li:last-child {
  border: 0 !important;
}

/*=====================================================================
//	table
=====================================================================*/

td,th{
    margin: 0 !important;
    padding: 5px　10px !important;
    line-height: 2;
}

th{
  background-color: #F4F4F4;
}

/*=====================================================================
//	position | display |
=====================================================================*/

.fixed{position: fixed !important;}
.relative{position: relative !important;}

.position-left{left:0 !important;}
.position-right{right: 0 !important;}

.display-block{display: block !important;}
.display-inline{display: inline !important;}

/*=====================================================================
//	page top
=====================================================================*/

/*=====================================================================
//	button
=====================================================================*/

.btn-txt12{font-size: 12px;}
.btn-txt24b{font-size: 24px; font-weight: bold; line-height: 1.7;}
.btn-txt28b{font-size: 28px; font-weight: bold;}

/*=====================================================================
//	header
=====================================================================*/

header{
  background-color:#FFF;
  position:sticky !important;
  width: 100%;
}

.header-icon-navi > a{
  padding: 5px 0 !important;
  text-align: center;
  border-left: solid 1px #FFF;
  color: #3d2c07 !important;
  font-weight: bold;
  text-decoration:none;
}

.header-icon-navi > a:last-child{
  border-right: solid 1px #FFF;
}

.header-icon-navi > a:hover{
  filter: alpha(opacity=70);
  -webkit-opacity: 0.70;
  -moz-opacity: 0.70;
  opacity: 0.70;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}

/* toggle inner */

.header-block-navi a{text-decoration: none;}
.header-block-navi a:hover{background-color: #f1ebe6;}

.header-text-navi a{
  color: #3d2c07 !important;
  text-decoration: none !important;
  font-size: 1.2em !important;
  padding-bottom:10px;
}

.header-text-navi a:hover{
  color:#f47900 !important;
}

.header-text-navi a:before{
  content: "・";
}


/*=====================================================================
//	footer
=====================================================================*/

footer .foot-keyword{
    padding: 20px 0;
    margin-bottom: 20px;
    border-bottom: #494949 1px solid;
    font-size: 1.2em;
    font-weight: bold;
    line-height: 1.6;
}

footer small,
footer address{
  width: 100%;
  padding: 15px 0 !important;
  font-size: 80%;
  text-align: center;
  display: block;
}

.footer-link .nav-link{border-right:#3d2c07 solid 1px !important;}

/*=====================================================================
//	contents title
=====================================================================*/

.com-contents-title{
  min-height: 320px;
  background-color: #494949;
  position: relative;
}

.com-contents-title p{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit-transform: translateY(-50%) translateX(-50%);

  width: 100%;
  padding: 15px 0;
  text-align: center;
  font-family: 'Noto Sans JP', sans-serif;
  background-color:rgba(255,255,255,0.8);
  color: #3d2c07;
}

.com-contents-title p span{
  display: block;
  font-weight: bold;
  padding-bottom: 20px;
  margin-bottom: 10px;
  border-bottom: 1px solid #3d2c07;
}

.com-contents-title-bg01{min-height: 500px; background: url('../img/com/com-title01-pickup-menu.jpg') no-repeat center center / cover !important;}
.com-contents-title-bg02{min-height: 500px; background: url('../img/com/com-title02-popular-menu.jpg') no-repeat center center / cover !important;}
.com-contents-title-bg03{background: url('../img/com/com-title03-regular-menu.jpg') no-repeat center center / cover !important;}
.com-contents-title-bg04{background: url('../img/com/com-title04-curry-menu.jpg') no-repeat center center / cover !important;}
.com-contents-title-bg05{background: url('../img/com/com-title05-dish-menu.jpg') no-repeat center center / cover !important;}

/* slide img */
.top-slide-pc img{
  width: 100%;
  height: 500px;
  object-fit: cover; /* この一行を追加するだけ！ */
}

/*=====================================================================
//	top
=====================================================================*/

.top-daily-sticker{
  position: absolute;
  top:-40px;
  left: 50%;
  transform: translateY(0) translateX(-50%);
  -webkit-transform: translateY(0) translateX(-50%);
}

/*=====================================================================
//	login front
=====================================================================*/

.lf-abouttitle-bg{
  background: url("../img/login/login-about-itemimg-bar.png") no-repeat center center / 100%;
}


.hexagon-text {
    margin: 0 auto;
    width: 90px;
    height: 155px;
    display: block;
    position: relative !important;
    background: #f1ebe6;
    transition: all 0.2s linear;
}
 
.hexagon-text p{
    width: 100%;
    line-height: 2;
    color: #000;
    text-align: center;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    -webkit-transform: translateY(-50%) translateX(-50%);
    z-index: 10;
}

.hexagon-bar::after{
  content: '';  
  width: 100%;
  border-top: 6px solid  #f1ebe6;
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit-transform: translateY(-50%) translateX(-50%);  
}
 
.hexagon-text:before,
.hexagon-text:after {
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    background: #f1ebe6;
    transition: all 0.2s linear;
    z-index: 0;
}
 
.hexagon-text:before {
    transform: rotate(60deg);
}
 
.hexagon-text:after {
    transform: rotate(-60deg);
}

.lf-deliverytime-bg{
  padding: 100px 0;
  background: url("../img/login/lf-deliverytime-bg.jpg") no-repeat center center / cover;
}

.lf-deliverytime-bg .container{
  max-width: 40% !important;
  background-color: rgba(255,255,255,0.9);
  padding: 50px;
}


/*=====================================================================
//	Navi menu
=====================================================================*/

button[aria-expanded="true"] > span {
  position: relative;
  display: none;
}
 
button[aria-expanded="true"]::after {
  top: 20px;
  right: 20px;
  font-size: 28px;
  content: "×";
}


/*=====================================================================
//	top btn
=====================================================================*/

/*トップへ戻るボタン*/
a.topBtn {
  position:fixed; /*固定*/
  bottom:30px; /*場所を右下に移動*/
  right:30px; /*場所を右下に移動*/
  display:block; /*aタグをblock要素に変更*/
  text-decoration:none !important;
  font-weight:bold;
  text-align:center;
  font-size: 12px !important;
}

a.topBtn i{
  font-size: 40px;
  display: block;
  padding-bottom: 5px;
}

a.topBtn:hover {
  opacity:0.7;
}