@charset "utf-8";
:root {
    --emi-site-page-bk:			#1a1a2f;		/* サイトのデフォルト背景色 */
    --emi-site-page-clr:		#d6b676;		/* サイトのデフォルト文字色 */
    
    --emi-site-menu-bar-bk:		#1a1a2f;		/* メニュバーの背景色 */

    --emi-site-title-bar-bk:	#d6b676;            /* タイトルバーの背景色 */
    --emi-site-title-bar-clr:	#1a1a2f;		   /* タイトルバーの文字色 */
    --emi-site-title-bar-clr:	black;             /* タイトルバーの文字色 */
    
    --emi-site-mbl_menu-bar-bk:     #d6b676;		/* モバイルボトムメニューの背景色 */
    --emi-site-mbl_menu-bar-clr:	#1a1a2f;		/* モバイルボトムメニューの文字色 */
    --emi-site-mbl_menu-bar-border: #e6d8b3;        /* モバイルボトムメニューの区切り線 */

  
    --emi-font-weight:          500;            /* デフォルトのフォントweight */
    --emi-font-type1: Arial, "Hiragino Sans", "Yu Gothic Medium", "Meiryo", sans-serif;
    --emi-font-type2: "Times New Roman", Times, "Yu Mincho", "游明朝", "游明朝体", "Hiragino Mincho Pro", serif;
    --emi-font-type3: Palatino, "Yu Kyokasho", "游教科書体", "UD デジタル 教科書体 N", "游明朝", "游明朝体", "Hiragino Mincho Pro", "Meiryo", serif;


    --emi-title-bar-bk-img-2:         url('/wp/wp-content/themes/emiemi18/assets/images/titlebar-frame.webp');         /* タイトルのフレーム */
    --emi-title-bar-bk-img-3:         url('/wp/wp-content/themes/emiemi18/assets/images/titlebar-frame.webp');         /* タイトルのフレーム */
    --emi-title-bar-bk-img-4:         url('/wp/wp-content/themes/emiemi18/assets/images/titlebar-frame.webp');         /* タイトルのフレーム */

    --emi-course-border:        #d6b676;        /* コース枠の色 */
    --emi-course-bk-img:        url('/wp/wp-content/themes/emiemi18/assets/images/course/main-courses-frame-2.webp');         /* コースのフレーム */
    --emi-course-bk-img-mask:   url('/wp/wp-content/themes/emiemi18/assets/images/course/main-courses-frame-mask.webp');    /* コースのマスク */
    
    --emi-course-name-clr:      #d6b676;        /* コース名の色 */
    --emi-course-name-clr:      black;        /* コース名の色 */
    --emi-course-amount-clr:    #d6b676;        /* コース料金の色 */
    --emi-course-comment-clr:   #d6b676;        /* コース説明の色 */
    --emi-course-font-weight:   500;            /* コース一覧のフォントweight */
    --emi-course-button-bk:     #6e2e2e;        /* コースのボタンの背景色 */
    --emi-course-button-clr:    #f9f9f9;        /* コースのボタンの文字色 */
    --emi-course-button-shadow: #808080;        /* コースのボタンの影色 */


    --emi-experience-border:    #d6b676;        /* first experience の左右ボーダーカラー */
    
    --emi-queen-bk-img:         url('/wp/wp-content/themes/emiemi18/assets/images/queens/main-queens-frame.webp');          /* 女王様のフレーム */
    --emi-queen-bk-img-mask:    url('/wp/wp-content/themes/emiemi18/assets/images/queens/main-queens-frame-mask.webp');     /* 女王様のマスク */
    --emi-queen-bk-img:         url('/wp/wp-content/themes/emiemi18/assets/images/queens/main-queens-frame-2.webp');          /* 女王様のフレーム */
    --emi-queen-bk-img-mask:    url('/wp/wp-content/themes/emiemi18/assets/images/queens/main-queens-frame-2-mask.webp');     /* 女王様のマスク */
    --emi-queen-name-clr:       #d6b676;        /* 女王様の名前の色 */
    
    --emi-top-inquiry-border-clr:       #d6b676;        /* 問い合わせボタンの枠色 */
    --emi-top-inquiry-clr:              #d6b676;        /* 予問い合わせボタンの文字色 */
    --emi-top-inquiry-bk-clr            #6e2e2e;        /* 問い合わせボタンの背景色 */

    --emi-top-reservation-border-clr:   #d6b676;        /* 予約ボタンの枠色 */
    --emi-top-reservation-clr:          #d6b676;        /* 予約ボタンの文字色 */
    --emi-top-reservation-bk-clr:       #6e2e2e;        /* 予約ボタンの背景色 */
    
    /* 女王様のシングルページ */
    --emi-main-queen-intro-queen-border-clr:    #d6b676;    /* ページ：女王様のコメント・プロファイル枠色 */
    --emi-main-queen-intro-queen-bk-clr:        #1a1a2f;    /* ページ：女王様のコメント・プロファイルの背景色 */
    --emi-main-queen-intro-queen-clr:           #d6b676;    /* ページ：女王様のコメント・プロファイル文字色 */
    
    --emi-main-queen-intro-btn-border-clr:      #d6b676;    /* ページ：女王様のコースボタン枠色 */
    --emi-main-queen-intro-btn-shadow:          #808080;    /* ページ：女王様のコースボタン枠影色 */
    --emi-main-queen-intro-btn-bk:              #d6b676;    /* ページ：女王様のコースボタン背景色 */
    --emi-main-queen-intro-btn-clr:             #f9f9f9;    /* ページ：女王様のコースボタン文字色 */


    /* 匠とは(about) */
    --emi-main-about-clr:                       #d6b676;        /* ページ：匠とは 文字色 */
    
    /* 初心者の方へ (First Experience) */ 
    --emi-main-experience-bk-img:               url('/wp/wp-content/themes/emiemi18/assets/images/experience/main-experience-item-box-frame.webp');     /* ページ：手順のフレーム */
    --emi-main-experience-clr:                  #d6b676;    /* ページ：First Experience 文字色 */
    --emi-main-experience-title-clr:            #1a1a2f;    /* ページ：First Experience アイテムのタイトル文字色 */
    --emi-main-experience-reservation-title-clr: #ffffff;   /* ページ：First Experience 予約のタイトル */
    --emi-main-experience-reservation-title-border: #d6b676;   /* ページ：First Experience 予約のタイトル */
    --emi-main-experience-reservation-bk-img:   url('/wp/wp-content/themes/emiemi18/assets/images/experience/main-experience-reservation-box-frame.webp');     /* ページ：本人からのフレーム*/

    /* 利用規約 */
    --emi-main-terms-clr:               #d6b676;    /* ページ：terms of service 文字色 */
    --emi-main-terms-bk-img:            url('/wp/wp-content/themes/emiemi18/assets/images/terms/main-term-frame.webp');     /* ページ：利用規約のフレーム*/
    --emi-main-terms-border-clr:        #d6b676;    /* ページ：terms of service 枠色 */

    /* 確認書 */
    --emi-main-confirmation-clr:                #d6b676;    /* ページ：terms of service 文字色 */
    --emi-main-tconfirmation-bk-img:            url('/wp/wp-content/themes/emiemi18/assets/images/terms/main-term-frame.webp');     /* ページ：利用規約のフレーム*/
    --emi-main-confirmation-border-clr:         #d6b676;    /* ページ：terms of service 枠色 */


    /* 予約 */
    --emi-main-reservation-clr:         #d6b676;    /* ページ：reservation 文字色 */

    /* コースリスト */
    --emi-main-course-clr:                      #d6b676;        /* ページ：コースリスト 文字色 */
    --emi-main-course-crs-title-bk-clr:         #d6b676;        /* ページ：コースリストのコース名背景色 */
    --emi-main-course-crs-title-clr:            #1a1a2f;        /* ページ：コースリストのコース名の文字色 */

    /* コース single */
    --emi-main-course-fee-border-clr:           #d6b676;        /* ページ：コース料金 枠色 */
    
    /* Q and A */
    --emi-main-qanda-clr:                       #d6b676;        /* ページ：Q and A 文字色 */
    
    /* blog */
    --emi-home-blog-clr:                        #d6b676;        /* ページ：blog 文字色 */
    
    /* VOICE(listener) */
    --emi-main-listener-clr:                    #d6b676;        /* ページ：VOICE(listener) 文字色 */

    /* inquiry */
    --emi-main-inquiry-clr:                     #d6b676;      /* ページ：inquiry 文字色 */

    /* album */
    --emi-main-album-clr:                       #d6b676;      /* ページ：album 文字色 */


}

.clearfix:after
{
	content: "";
	display: block;
	clear: both
}


.flt-lft    {   float:left;     }   

.w25p   {    width: 25%;  }
.w50p   {    width: 50%;  }
.w75p   {    width: 75%;  }
.w100p  {    width: 100%;  }


.mt10 {    margin-top: 10px !important;  }
.mt20 {    margin-top: 20px !important;  }
.mt30 {    margin-top: 30px !important;  }
.mt40 {    margin-top: 40px !important;  }
.mt50 {    margin-top: 50px !important;  }

.mt1em {    margin-top: 1em !important;  }
.mt2em {    margin-top: 2em !important;  }
.mt3em {    margin-top: 3em !important;  }

.mb10 {    margin-bottom: 10px !important;  }
.mb20 {    margin-bottom: 20px !important;  }
.mb30 {    margin-bottom: 30px !important;  }
.mb40 {    margin-bottom: 40px !important;  }
.mb50 {    margin-bottom: 50px !important;  }

.mb1em {    margin-bottom: 1em !important;  }
.mb2em {    margin-bottom: 2em !important;  }
.mb3em {    margin-bottom: 3em !important;  }

.ml0    {    margin-left: 0    !important;  }
.ml10   {    margin-left: 10px !important;  }
.ml15   {    margin-left: 15px !important;  }
.ml20   {    margin-left: 20px !important;  }
.ml30   {    margin-left: 30px !important;  }


.pl0    {   padding-left:0    !important;  } 
.pl10   {   padding-left:10px !important;  }
.pl15   {   padding-left:15px !important;  }
.pl20   {   padding-left:20px !important;  }

.pb0    {   padding-bottom:0  !important;  }
.pb10   {   padding-bottom:0  !important;  }
.pb15   {   padding-bottom:0  !important;  }
.pb20   {   padding-bottom:0  !important;  }

.bg-bk  {   background-color: black  !important;    }
.bg-pk  {   background-color: pink  !important;     }
.bg-yw  {   background-color: yellow  !important;   }
.bg-gd  {   background-color: gold  !important;     }


 
.bold {    font-weight: bold;  }
 
.ul-black {
    border-bottom:1px solid black;
}

.bk-center {    display:block;margin: 0 auto;      }

.ta-center {    text-align:center;  }
.ta-left   {    text-align:left;    }
.ta-right  {    text-align:right;   }
.ta-start  {    text-start:left;    }
.ta-end    {    text-end:left;      }

.ts-none   {    text-shadow: none !important; }


.val-top {
    vertical-align:top !important;
}
.val-mid {
    vertical-align:middle !important;
}
.val-btm {
    vertical-align:bottom !important;
}

.bk-pink {  background-color: pink;         }
.bk-red  {  background-color: red;          }
.bk-aqm  {  background-color: aquamarine;   }
.bk-gold {  background-color: gold;         }


img {
	vertical-align:top;
}

/*===================================
     image size class 
  ===================================*/
img.image-center-50p {
	width: 50%;
	height:auto;
	margin:0 auto;
	display: block;
}
img.image-center-75p {
	width: 75%;
	height:auto;
	margin:0 auto;
	display: block;
}
img.image-center-100p {
	width: 100%;
	height:auto;
	margin:0 auto;
	display: block;
}
figcaption.fig-caption-50p {
	width: 50%;
	height:auto;
	margin:0 auto;
	display: block;
}
figcaption.fig-caption-75p {
	width: 75%;
	height:auto;
	margin:0 auto;
	display: block;
}
figcaption.fig-caption-100p {
	width: 100%;
	height:auto;
	margin:0 auto;
	display: block;
}

body {
	margin:0;
	background-color: var(--emi-site-page-bk);
	font-family:    var(--emi-font-type1);
    font-weight:    var(--emi-font-weight);
	box-sizing: border-box;
}




/*===================================
     404 erro page 
  ===================================*/
.page404-img {
	width: 100%;
	height:auto;
	margin-bottom: 50px;
}


/* ============ 以下カスタマイズ ============== */















/*===================================
     top filed area  
  ===================================*/
.bar-title-1 {
	width: 100%;
	font-size: 3rem;
	height: 2em;
	line-height: 2em;
	background-color: var(--emi-site-title-bar-bk);
	color: var(--emi-site-title-bar-clr);
	text-align: center;
	border-radius: 5px;
}

.bar-title-2, .bar-title-2lng {
	width: 100%;
	font-size: 2.5rem;
	height: 4rem;
	line-height: 4rem;
	color: var(--emi-site-title-bar-clr);
	text-align: center;
    background-image: var(--emi-title-bar-bk-img-2);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}
.bar-title-2lng {
    font-size: min(2.5rem, 4vw);
}

.bar-title-3, .bar-title-3s {
	width: 100%;
	font-size: 2rem;
	height: 2em;
	line-height: 2em;
    background-image: var(--emi-title-bar-bk-img-3);
    background-repeat: no-repeat;
    background-size: 100% 100%;
	color: var(--emi-site-title-bar-clr);
	text-align: center;
	border-radius: 5px;
}
.bar-title-3s {
	font-size: 1.5rem;
}
.bar-title-4, .bar-title-4s {
	width: 100%;
	font-size: 1.5rem;
	height: 1.5em;
	line-height: 1.5em;
    background-image: var(--emi-title-bar-bk-img-4);
    background-repeat: no-repeat;
    background-size: 100% 100%;
	color: var(--emi-site-title-bar-clr);
	text-align: center;
	border-radius: 5px;
}
.bar-title-4s {
	font-size: 1em;
}
/*===================================
     数字のリスト
  ===================================*/
ol.number_list {
	list-style:none; 		/* olが数字を付けることをキャンセル */
	counter-reset:number; 	/* 名前を付けたカウンターをリセット */
	margin-left: 2rem;
}
ol.number_list li::before{
	display: block;
	float: left;
	margin-left: -2rem;
	counter-increment: number; /* 任意の名前を付けて！ */
	content: counter(number)'.'; /* 名前を付けたカウンターを呼び出し */
}


/*===================================
     まる数字のリスト
  ===================================*/
ol.number_list_marunum {
	counter-reset:marunumber; 	/* 名前を付けたカウンターをリセット */
	margin-left: 2rem;
	margin-left: 2rem;
}
ol.number_list_marunum li {
	line-height: 2em;
}
ol.number_list_marunum li::before {
	margin-left: -2rem;
	counter-increment: marunumber; /* 任意の名前を付けて！ */
	content: counter(marunumber);
	background-color: #000;
/*	color: #fff;*/
	border: solid 1px;
	display: block;
	float: left;
	line-height: 1.6rem;
	text-align: center;
	height: 1.6rem;
	width: 1.6rem;
	border-radius: 50%;
	margin-top: 4px;
}

/*===================================
     ピリオドリスト
  ===================================*/
ul.piriod_list {
	list-style:none;
	margin-left: 20px;
}
ul.piriod_list li::before{
	display: block;
	float: left;
	margin-left: -20px;
	content: '・';
}

/*===================================
     大きな丸リスト
  ===================================*/
ul.bigcircle, ul.bigcircle-opt {
	list-style:none;
	margin-left: 2rem;
	line-height: 2rem;
}
ul.bigcircle li::before, ul.bigcircle-opt li::before{
  	display: block;
/*	vertical-align: middle;*/
	float: left;
	margin-left: -20px;
	content: '';
	width:1em;
	height: 1em;
	background: #aa0000;
	border-radius: 50%;
	margin-top:0.5rem;
}
ul.bigcircle-opt li::before{
	background: #d9a333;
}











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

.top-header-h1 {
	display: none;
}

.header-inner {
	position:fixed;
	top: 0;
	left: 0;
	width: 100%;
    height: 50px;
    z-index: 20;
    background: rgba(0,0,0,.7);
    
}

.headre-logo {
	width: auto;
	height: 100%;
	margin: 0;
	position: absolute;
	top: 0;
	left: 20px;
}
.headre-logo img {
	width: auto;
	height: 100%;
}
.mobile-3m {
	width: auto;
	height: 100%;
	margin: 0;
	position: absolute;
	top: 0;
	right: 10px;
}
.site_menu_icon {
	color: #d9a333;
}

.menu-pc {
	display: none;
}

/*===================================
     main contents
  ===================================*/
#contents {
/*	margin-top:60px;*/
}


/*===================================
     top image
  ===================================*/
.top-image-outer {
	padding: 0 5px;
	margin-top: 50px;
}
.top-images {
}

.top-image {
	width: 100%;
	height: auto;
}

/*===================================
     top message
  ===================================*/
.top-msg-outer {
}

.top-msgs {
	width: 100%;
	height: auto;
}
.top-msg-image {
	width: 100%;
	height: auto;
}


/*===================================
     top about
  ===================================*/
.top-about-outer {
	padding: 5px;
	color: var(--emi-site-page-clr);
	font-family:    var(--emi-font-type2);
    font-weight:    var(--emi-font-weight);
}
.top-about-inner {
	padding:10px;
/*	background:gray;*/
	font-size: 1.1rem;
}

.top-about-items {
	display: flex;
}

.top-about-left {
	width: 60%;
	white-space: nowrap;
}

.top-about-right {
	width: 40%;
}

.top-about-img {
	width: 100%;
	height:auto;
}

#top-about .bar-title-3 {
	width: 100%;
	font-size: 1.4rem;
	height: 2rem;
	line-height: 1.4rem;
	background-color: transparent;
	background-image: initial;
	color: var(--emi-site-page-clr);
	text-align: left;
	border-radius: 0;
}
.top-about-line {
    text-decoration: line-through;
}

/*===================================
     top course list
  ===================================*/
.top-course-outer{
	font-family:    var(--emi-font-type2);
    font-weight:    var(--emi-course-font-weight);
}
.top-course-inner{
    backgrouns-color: gray;
}
.top-course-title {
/*    display: none;*/
}
.top-course-items {
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
}

.top-course-item {
    width: 45%;
    max-width: 300px;
    height: 200px;
    background-image: var(--emi-course-bk-img);
    background-repeat: no-repeat;
    background-size: 100% 100%;
	position: relative;
}
.top-course-item-low {
    width: 95%;
    max-width: none;
    margin-top:20px;
}

.top-course-name{
    color: var(--emi-course-name-clr);
    position: absolute;
    top: 20%;
    left: 5%;
    font-size: 0.8rem;
    width: calc(100% - 10%);
    text-align:center;
}

.top-course-amount{
    color: var(--emi-course-amount-clr);
    position: absolute;
    top: 30%;
    left: 5%;
    font-size: 1.0rem;
    width: calc(100% - 10%);
    text-align:center;
}

.top-course-comment{
    color: var(--emi-course-comment-clr);
    position: absolute;
    top: 50%;
    left: 5%;
    font-size: 0.8rem;
    width: calc(100% - 10%);
    text-align:center;
}

.top-course-button{
    position: absolute;
    top: 70%;
    left: calc(5% + 10px);
    width: calc(90% - 20px);
    height: 20px;
    border: 2px solid var(--emi-course-button-bk);
    box-shadow: 5px 5px 5px var(--emi-course-button-shadow);
    background-color: var(--emi-course-button-bk);
    color: var(--emi-course-button-clr);
    font-size: 0.6rem;
    line-height: 20px;
    text-align: center;
}
.top-course-button-atag {
    display:block;
    width:100%;
    height:100%;
}

.top-course-button-atag:hover {
    cursor: pointer; 
}

/*===================================
     top first exprerience
  ===================================*/
.top-experience-outer {
}
.top-experience-inner {
    border: double 5px var(--emi-experience-border);
    border-right-style: double;
    border-top-style: none;
    border-bottom-style: none;
    padding:20px 20px 20px 20px;
    margin:0 20px;
}
.top-experience-image-box {
    width: 100%;
    height: auto;
    position:relative;
}
.top-experience-image {
    width: 100%;
    height: auto;    
}
.top-experience-atag {
    position:absolute;
    top:0;
    left:0;
    width: 100%;
    height:100%;
    z-index:10;
}

/*===================================
     top quees and courses list tab 
  ===================================*/
.top-candq-buttons {
	display: flex;
	justify-content: normal;
	flex-wrap: wrap;
}

.top-candq-button {
    width: 45%;
    height: 200px;
}

/*.top-candq-courses {
    background-image: var(--emi-candq-courses-btn-img);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}
.top-candq-queens {
    background-image: var(--emi-candq-queens-btn-img);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}*/

/*===================================
     top queens list
  ===================================*/
.main-queens-outer {
	font-family:    var(--emi-font-type2);
    font-weight:    var(--emi-font-weight);
}

.main-queens-inner {
}

#top-queen .bar-title-3 {
	width: 100%;
	font-size: 2rem;
	height: 2rem;
	line-height: 1.4rem;
	background-color: transparent;
	color: var(--emi-site-page-clr);
	text-align: center;
	border-radius: 0;
}

.main-queens-items {
	display: flex;
	justify-content: normal;
	flex-wrap: wrap;
	max-width: 1250px;
	margin: 0 auto;

    width: min( 930px, 100vw );	
}

.main-queens-item {
    width: calc((100vw - 40px) / 3);
    height: calc(((100vw - 40px) / 3) + 60px);
    background-image: var(--emi-queen-bk-img);
    background-repeat: no-repeat;
    background-size: 100% 100%;
	position: relative;
	margin-left: 10px;
	margin-bottom: 10px;
	max-width: 300px;
	max-height: 360px;
}

.main-queens-frame-mask {
    position: absolute;
    top: 0;
    left: 0;
    width: calc((100vw - 40px) / 3);
    height: calc(((100vw - 40px) / 3) + 60px);
    z-index: -1;
    display: block;
	max-width: 300px;
	max-height: 360px;
    background-image: var(--emi-queen-bk-img-mask);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}
.main-queens-frame {
    width:100%;
    height: 100%;
}

.main-queens-img-box {
    position: absolute;
    top: min(2vw, 15px);
    left: 0;
    height: calc((100vw - 30px) / 3);
    z-index: -2;
    display: block;
}

.main-queens-img{
    width:100%;
margin-top:10px;
margin-left:10px;
width: calc(100% - 20px);
}

.main-queens-name {
    position:absolute;
    bottom: 25px;
    line-height: 20px;
    width:100%;
    display: block;
    text-align:center;
    font-size: 0.8rem;
    color: var(--emi-queen-name-clr);
}

.main-queens-atag {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
/*    z-index: 20;*/
}
.main-queens-atag a {
    display:block;
    width:100%;
    height:100%;
}
/*===================================
     top reservation / inquiry
  ===================================*/
.top-reservation-outer {
	font-family:    var(--emi-font-type2);
    font-weight:    var(--emi-font-weight);
}

.top-reservation-inner {
}

.top-reservation-title {
    display: none;
}

.top-reservation-items {
	display: flex;
	justify-content: space-around;
	flex-wrap: nowrap;
}

.top-reservation-item {
    border: solid 2px var(--emi-top-reservation-border-clr);
    width: 45%;
    height: 40px;
    color: var(--emi-top-reservation-clr);
    background-color: var(--emi-top-reservation-bk-clr);
    line-height: 40px;
    text-align: center;
	position: relative;
}

.top-inquiry-item {
    border: solid 2px var(--emi-top-inquiry-border-clr);
    width: 45%;
    height: 40px;
    color: var(--emi-top-inquiry-clr);
    background-color: var(--emi-top-inquiry-bk-clr);
    line-height: 40px;
    text-align: center;
	position: relative;
}

.top-reservation-button-atag {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
}


/*========================================================
     以下ページ毎
  ========================================================*/

/*===================================
     main queen intro page (single)
  ===================================*/
.main-queen-intro {
	font-family:    var(--emi-font-type2);
    font-weight:    var(--emi-font-weight);
    color: var(--emi-main-queen-intro-queen-clr);
    padding: 0 20px;
}

.main-queen-intro-img-box {
    width: 75%;
    display: block;
    margin: 0 auto;
}
.main-queen-intro-img {
    width:100%;
}
.main-queen-intro-name {
    text-align: center;
}
.main-queen-intro-img-sub-items {
    display:flex;
    justify-content:center;
}
.main-queen-intro-img-sub-item {
    width: min(15%, 50px);
    padding:0 5px;
    margin:0 5px;
}
.main-queen-intro-sub-img-box {
    width: 100%;
}
.main-queen-intro-sub-img {
    width: 100%;
}

.main-queen-intro-queen-comment-box, .main-queen-intro-manager-comment-box {
    border : solid 1px var(--emi-main-queen-intro-queen-border-clr);
    background-color: var(--emi-main-queen-intro-queen-bk-clr);
/*    color: var(--emi-main-queen-intro-queen-clr);*/
    padding: 10px;
}
.main-queen-intro-queen-comment-title, .main-queen-intro-manager-comment-title {
    font-size: 1.2rem;
    margin-bottom:5px;
}
.main-queen-intro-queen-comment, .main-queen-intro-manager-comment {
}

.main-queen-intro-snsbox {}
.main-queen-intro-queen-sns {
    color: red;
    text-align : center;
    margin: 0 auto;
}
.main-queen-intro-queen-snsicon{
    width: 40px;
}

.main-queen-intro-profile-box {
    border : solid 1px var(--emi-main-queen-intro-queen-border-clr);
    background-color: var(--emi-main-queen-intro-queen-bk-clr);
/*    color: var(--emi-main-queen-intro-queen-clr);*/
    padding: 10px;
}
.main-queen-intro-profile-title {
    font-size: 1.2rem;
    margin-bottom:5px;
}
.main-queens-intro-profile-items {
}

.main-queens-intro-profile-item,
.main-queen-intro-options-item{
    display:flex;
    border: 1px solid #ccc;
    line-height: 1.2rem;
    font-size: 0.9rem
}
.main-queens-intro-profile-title,
.main-queen-intro-profile-title{
    width: 30%;
    text-align: center;
}
.main-queens-intro-profile-content{
    padding-left: 10px;
    border-left: 1px solid #ccc;
}
.main-queens-intro-profile-item:nth-child(even) {
    background:#FFE8EA;
}
.main-queen-intro-freeoptions-name,
.single-options {
    width: 90%;
}
.main-queen-intro-freeoptions-can {
    border-left: 1px solid #ccc;
    width: 10%;
    text-align: center;
}
.main-queen-intro-paideeoptions-name{
    width: 70%;
}
.main-queen-intro-paideeoptions-can {
    width: 10%;
    text-align: center;
    border-left: 1px solid #ccc;
}
.main-queen-intro-paideeoptions-price {
    width: 20%;
    text-align: center;
    border-left: 1px solid #ccc;
}

.main-queens-intro-cource-button {
    width: calc(90% - 20px);
    margin: 0 auto;
    height: 40px;
    border: 2px solid var(--emi-main-queen-intro-btn-border-clr);
    box-shadow: 5px 5px 5px var(--emi-main-queen-intro-btn-shadow);
    background-color: var(--emi-main-queen-intro-btn-bk);
    color: var(--emi-main-queen-intro-btn-clr);
    font-size: 0.6rem;
    line-height: 40px;
    text-align: center;
}
.main-queens-intro-cource-button-atag {
    display:block;
    width:100%;
    height:100%;
}
.main-queens-intro-cource-button-atag::hover {
    cursor: pointer; 
}



/*===================================
     main first experience page (page)
  ===================================*/
.main-experience-outer {
	font-family:    var(--emi-font-type2);
    font-weight:    var(--emi-font-weight);
    color: var(--emi-main-experience-clr);
}
.main-experience-inner {
}

.main-experience-items {
	display: flex;
	justify-content: space-around;
	flex-wrap: nowrap;
}
#main-experience .bar-title-2 {
    display: none;
}

.main-experience-item {
    width: 30%;
    height: 120px;
	position: relative;
}
.main-experience-item-no {
    height: 20px;
    line-height: 20px;
    display: block;
    text-align: center;
}
.main-experience-item-box {
    width: 100%;
    height: 100px;

    background-image: var(--emi-main-experience-bk-img);
    background-repeat: no-repeat;
    background-size: 100% 100%;
	position: relative;
}

.main-experience-icon {
    position: absolute;
    top: 20%;
    left:25%;
    width: 50%;
    height: auto;
}
.main-experience-icon-img {
    width: 100%;
}
.main-experience-title {
    position: absolute;
    top: 60%;
    left:5px;
    text-align: center;
    width: calc(100% - 10px);
}

.main-experience-title {
	color: var(--emi-main-experience-title-clr);
	font-size: 0.7rem
}
.main-experience-title span {
    display: block;
}

.main-experience-reservation{
}
.main-experience-reservation-box {
    margin: 5px;
    background-image: var(--emi-main-experience-reservation-bk-img);
    background-repeat: no-repeat;
    background-size: 100% 100%;
	position: relative;
    padding: 20px 20px 40px 20px;	
}

.main-experience-reservation-title {
/*    display: none;*/
}
#main-experience .bar-title-3 {
	width: 100%;
	font-size: 2rem;
	height: 2rem;
	line-height: 1.4rem;
	background-color: transparent;
	border-bottom: solid 1px var(--emi-main-experience-reservation-title-clr);
	color: var(--emi-main-experience-reservation-title-clr);
	text-align: center;
	border-radius: 0;
}


.main-experience-reservation-items {
	display: flex;
	justify-content: space-around;
	flex-wrap: nowrap;
}

.main-experience-reservation-item {
    border: solid 2px var(--emi-top-reservation-border-clr);
    width: 45%;
    height: 40px;
    color: var(--emi-top-reservation-clr);
    background-color: var(--emi-top-reservation-bk-clr);
    line-height: 40px;
    text-align: center;
	position: relative;
}

.main-experience-inquiry-item {
    border: solid 2px var(--emi-top-inquiry-border-clr);
    width: 45%;
    height: 40px;
    color: var(--emi-top-inquiry-clr);
    background-color: var(--emi-top-inquiry-bk-clr);
    line-height: 40px;
    text-align: center;
	position: relative;
}

.main-experience-reservation-button-atag {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
}



/*===================================
     main terms of service page (page)
  ===================================*/
.main-terms-outer {
	font-family:    var(--emi-font-type2);
    font-weight:    var(--emi-font-weight);
    color:          var(--emi-main-terms-clr);
}
.main-terms-inner {
}
.main-terms-box {
/*    background-image: var(--emi-main-terms-bk-img);*/
/*    background-repeat: no-repeat;*/
/*    background-size: 100% 100%;*/
    border: solid 2px var(--emi-main-terms-border-clr);
	position: relative;
	margin: 5px;
	padding: 40px 5px;
}

.main-terms-title {
/*    display: none;*/
}


.main-terms-title {
    font-size: 2rem;
    text-align:center;
}
.main-terms-title-sub {
    font-size: 1.2rem;
    text-align:center;
}


/*===================================
     main confirmation page (page)
  ===================================*/
.main-confirmation-outer {
	font-family:    var(--emi-font-type2);
    font-weight:    var(--emi-font-weight);
    color:          var(--emi-main-confirmation-clr);
}
.main-confirmation-inner {
}
.main-confirmation-box {
/*    background-image: var(--emi-main-confirmation-bk-img);*/
/*    background-repeat: no-repeat;*/
/*    background-size: 100% 100%;*/
    border: solid 2px var(--emi-main-confirmation-border-clr);
	position: relative;
	margin: 5px;
	padding: 40px 5px;
}

.main-confirmation-title {
/*    display: none;*/
}


.main-confirmation-title {
    font-size: 2rem;
    text-align:center;
}
.main-confirmation-title-sub {
    font-size: 1.2rem;
    text-align:center;
}


/*===================================
     main about page 
  ===================================*/
.main-about-outer {
	padding: 5px;

	color : white;
	font-family:    var(--emi-font-type2);
    font-weight:    var(--emi-font-weight);
    color:          var(--emi-main-about-clr);
}
.main-about-inner {
}
.main-about-title {
    font-size: 2rem;
}

.main-about-txt {
	font-size: 1.5rem;
}

/*===================================
     main reservation page 
  ===================================*/
.main-reservation-outer {
	font-family:    var(--emi-font-type2);
    font-weight:    var(--emi-font-weight);
    color:          var(--emi-main-reservation-clr);
}
.main-reservation-inner {
}
.main-reservation-title {
/*    display: none;*/
}

.main-reservation-txt {
}

/*===================================
     main inquiry page 
  ===================================*/
.main-inquiry-outer {
	font-family:    var(--emi-font-type2);
    font-weight:    var(--emi-font-weight);
    color:          var(--emi-main-inquiry-clr);
}
.main-inquiry-inner {
}
.main-inquiry-title {
/*    display: none;*/
}

.main-inquiry-txt {
}

/*===================================
     queens list 
  ===================================*/
.main-queens-outer {
	font-family:    var(--emi-font-type2);
    font-weight:    var(--emi-font-weight);
    color:          var(--emi-main-queens-clr);
}
.main-queens-inner {
}
.main-queens-title {
/*    display: none;*/
}

/*===================================
     main course list page 
  ===================================*/
.main-course-outer {
	font-family:    var(--emi-font-type2);
    font-weight:    var(--emi-font-weight);
    color:          var(--emi-main-course-clr);
}
.main-course-inner {
}
.main-course-title {
/*    display: none;*/
}

.main-course-txt {
}

/*===================================
     course list 
  ===================================*/
.main-course-items {
    display: flex;
   	justify-content: normal;
    flex-wrap: wrap;

	justify-content: normal;
	max-width: 1250px;
	margin: 0 auto;

    width: min( 930px, 100vw );	
    
/*    align-items: flex-start;*/
/*    list-style: none;*/
/*	padding:0;*/
}
.main-course-items p {
	margin:0;
	padding:0;
}

.main-course-items figcaption {
	display:none;
	width: 100%;
}

.main-course-item {
    width: calc((100vw - 40px) / 3);
    height: calc(((100vw - 40px) / 3) + 60px);
    height: calc(((100vw - 40px) / 3) + 40px);
    background-image: var(--emi-course-bk-img);
    background-repeat: no-repeat;
    background-size: 100% 100%;
	position: relative;
	margin-left: 10px;
	margin-bottom: 10px;
	max-width: 300px;
	max-height: 360px;
}

.main-course-frame-mask {
    position: absolute;
    top: 0;
    left: 0;
    width: calc((100vw - 40px) / 3);
    height: calc(((100vw - 40px) / 3) + 60px);
    height: calc(((100vw - 40px) / 3) + 40px);
    z-index: -1;
    display: block;
	max-width: 300px;
	max-height: 360px;
    background-image: var(--emi-course-bk-img-mask);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.main-course-frame {
    width:100%;
    height: 100%;
}

.main-course-img-box {
    position: absolute;
    top: 20%;
    left: 0;
    height: calc((100vw - 30px) / 3);
    z-index: 10;
    display: block;
}

.main-course-img{
    width:100%;
/*margin-top:10px;*/
margin-left:3%;
width: calc(100% - 6%);
}

.main-course-name {
    position:absolute;
    top: 0;
    line-height: min(5vw, 45px);
    width:100%;
    display: block;
    text-align:center;
    font-size: min(2vw, 1.2rem);
    color: var(--emi-course-name-clr);
}

.main-course-atag {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    z-index: 20;
}
.main-course-atag a {
    display:block;
    width:100%;
    height:100%;
}


/*.main-course-crs-box-outer {
	width: 100%;
	height: auto;
	position: relative;
}

.main-course-crs-img-box {
	margin: 0;
}

.main-course-crs-img {
	width: 100%;
	height:auto;
}
.main-course-crs-title-box {
	background: var(--emi-main-course-crs-title-bk-clr);
	height:30px;
}
.main-course-crs-title {
	text-align:center;
	font-size:1.1rem;
	line-height:30px;
	color: var(--emi-main-course-crs-title-clr);
}*/

/*.main-course-crs-detail:hover {
}

.main-course-crs-detail-txt {
	display:none;
}
.main-course-crs-detail-btn {
	display:block;
	position: absolute;
	top:0;
	left:0;

	width: 100%;
	height:100%;
}*/

/*===================================
     main course(single) 
  ===================================*/
.main-course-single-outer {
}
.main-course-single-outer {
	font-family:    var(--emi-font-type2);
    font-weight:    var(--emi-font-weight);
    color:          var(--emi-main-course-clr);
}
.main-course-single-inner {
    margin:20px;
}
.main-course-single-title {
/*    display: none;*/
}

.main-course-single-catch {
    text-align: center;
    font-size:1.2rem;
}

.course-content {
}

.course-content-cmt {
    font-size:0.8rem;
}

.course_fee_box, .course-fee-box {
	font-size:1.1rem;
	color:red;
	line-height: 1.2em;	
	border : solid 2px var(--emi-main-course-fee-border-clr);
	border-radius:10px;
	padding:10px;
}

.system-name {
}
.system-name-cmt {
    font-size:0.8rem;
}

.main-course-single-option{
}

.main-queens-free-foptions-box{
}
.main-course-single-freeoptions-title {
}
.main-course-single-freeoptions-box {
    margin-left: 10px;
    margin-right:10px;
}
.main-course-single-freeoptions-items {
    margin-left: 10px;
    margin-right:10px;
}
.main-course-single-freeoptions-item {
    display:flex;
    border: 1px solid #ccc;
    line-height: 1.5rem;
    font-size: 0.9rem
}
.main-course-single-freeoptions-name{
    width: 100%;
}

.main-course-single-paidoptions-title {
}
.main-course-single-paidoptions-box {
    margin-left: 10px;
    margin-right:10px;
}
.main-course-single-paidoptions-items {
    margin-left: 20px;
    margin-right:20px;
}
.main-course-single-paidoptions-item {
    display:flex;
    border: 1px solid #ccc;
    line-height: 1.5rem;
    font-size: 0.9rem
}
.main-course-single-paidoptions-name{
    width: 30%;
}
.main-course-single-paidoptions-price {
    width: 20%;
    text-align: center;
    border-left: 1px solid #ccc;
}
.main-course-single-paidoptions-comment {
    width: 50%;
    text-align: left;
    border-left: 1px solid #ccc;
}

/*===================================
     main Q and A ページ 
  ===================================*/
.main-qanda-outer {
    padding: 5px;
    color: black;
}

.main-qanda-inner {
}

.main-qanda-list {
	line-height: 1.5rem;
	font-size:1.0rem;
	text-decoration:underline;
	color: black;
}
.main-qanda-items {
	counter-reset:qanumber; 	/* 名前を付けたカウンターをリセット */
}

.main-qanda-items .main-qanda-item {
	border: 1px solid #ccc;
	margin-bottom:10px;
	border-radius: 10px;            /* CSS3草案 */  
	overdflow: hidden;
}

.main-qanda-items .main-qanda-item-qtn {
	display:block;
	font-weight: bold;
	color: gray;
	background-color: pink;					/*背景色（古いブラウザだとここの色のみが出ます）*/
	padding: 8px;
	border-radius: 10px 10px 0 0 ;
	line-height: 120%;
}
.main-qanda-items .main-qanda-item-qtn:before {
	counter-increment: qanumber;
	content: "Q"counter(qanumber)":";
	font-weight: bold;
	margin-right: 8px;
}
.main-qanda-items .main-qanda-item-ans {
	display:block;
	padding: 8px 16px 12px 30px;
	margin: 0;
	line-height: 120%;
}
.main-qanda-items .main-qanda-item-ans:before {
	content: "A:";
	font-weight: bold;
	margin-right: 8px;
	margin-left: -21px;
}

/*===================================
     main listener 
  ===================================*/
.main-listener-outer {
	font-family:    var(--emi-font-type2);
    font-weight:    var(--emi-font-weight);
    color:          var(--emi-main-listener-clr);
}
.main-listener-inner {
	padding: 5px;
}
/*お客様の声*/
.main-listner-title {
/*    display:none;*/
}
.main-listner-items{
}
.main-listener-item {
	width: auto;
	margin: 0 10px 30px 10px;
/*   border: solid 1px #ff69b4; */
	display: block;
  overflow: hidden;
	height: 120px;

    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
}
.main-listener-item:after {
	content: "";
	display: block;
	clear: both;
}

.main-listener-header {
	float: left;
	display: block;
	width: 80px;
	margin: 0;
}
.main-listener-body {
	float: left;
	margin: 0 0 0 20px;
/* 	width: 674px; */
    width: calc(100% - 104px);
}
.main-listener-header a {
	display: block
}
.main-listener-header a:hover {
	opacity: .8
}

.main-listener-img {
	display: block;
	width:  80px;
	height: 80px;
	margin: 0 0 0 0;
}
.main-listener-img img {
	width: 100%;
	height:auto;
/* 	display:none; */
}
.main-listener-header figure {
	margin: 0;
	display: block;
	position: relative;
}

.main-listener-header .main-listener-caption {
	padding: 1px 0 2px;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	color: #fff;
	background-color: rgba(0, 0, 0, 0.5);
	font-weight: 600;
	font-size: 90%;
	text-align: center;
}
.main-listener-date {
	float: left;
	color: #999;
}

.main-listener-item .morebutton {
	float: left;
	font-size:0.75em;
	display:block;
	width:30px;
	margin: 0;
	padding-top:0px;
	padding-bottom:0px;
	text-align:center;
	border:2px solid;
	border-color:#aaaaaa #444444 #444444 #aaaaaa;
	background:#cccccc;
}

.main-listener-item .morebutton:hover{
	background:#777777;
}
/*お客様の声バルーン*/
.main-listener-item .baloon {
	position: relative;
	background: #f0f5e4;
	border: 2px solid #f5aee9;
}
.main-listener-item .baloon:after,.main-listener-item .baloon:before {
	right: 100%;
	top: 30px;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.main-listener-item .baloon:after {
	border-color: rgba(240, 245, 228, 0);
	border-right-color: #f0f5e4;
	border-width: 15px;
	margin-top: -15px;
}
.main-listener-item .baloon:before {
	border-color: rgba(245, 174, 233, 0);
	border-right-color: #f5aee9;
	border-width: 18px;
	margin-top: -18px;
}

.main-listener-item pre {
/* Mozilla */
white-space: -moz-pre-wrap;
/* Opera 4-6 */
white-space: -pre-wrap;
/* Opera 7 */
white-space: -o-pre-wrap;
/* CSS3 */
white-space: pre-wrap;
/* IE 5.5+ */
word-wrap: break-word;
}


/*===================================
     main Q and A ページ
  ===================================*/
.main-qanda-outer {
	font-family:    var(--emi-font-type2);
    font-weight:    var(--emi-font-weight);
    color:          var(--emi-main-qanda-clr);
}

.main-qanda-inner {
}
.main-qanda-title {
/*    display: none;*/
}
.main-qanda-list {
	line-height: 1.5rem;
	font-size:1.0rem;
	text-decoration:underline;
	color: white;
}
.main-qanda-items {
	counter-reset:qanumber; 	/* 名前を付けたカウンターをリセット */
}

.main-qanda-items .main-qanda-item {
	border: 1px solid #ccc;
	margin-bottom:10px;
	border-radius: 10px;            /* CSS3草案 */  
	overdflow: hidden;
}

.main-qanda-items .main-qanda-item-qtn {
	display:block;
	font-weight: bold;
	color: white;
	background-color: #d9a333;					/*背景色（古いブラウザだとここの色のみが出ます）*/
	padding: 8px;
	border-radius: 10px 10px 0 0 ;
	line-height: 120%;
}
.main-qanda-items .main-qanda-item-qtn:before {
	counter-increment: qanumber;
	content: "Q"counter(qanumber)":";
	font-weight: bold;
	margin-right: 8px;
}
.main-qanda-items .main-qanda-item-ans {
	display:block;
	padding: 8px 16px 12px 30px;
	margin: 0;
	line-height: 120%;
}
.main-qanda-items .main-qanda-item-ans:before {
	content: "A:";
	font-weight: bold;
	margin-right: 8px;
	margin-left: -21px;
}


/*===================================
     home Blog
  ===================================*/
.home-blog-outer {
	font-family:    var(--emi-font-type2);
    font-weight:    var(--emi-font-weight);
    color:          var(--emi-home-blog-clr);
}
.home-blog-inner {
}

.home-blog-items {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    list-style: none;
	padding:0;
}

.home-blog-item {
	width: 100%;
	height: 100px;
	
	margin-bottom:20px;
	background: #e6d8b3;
	font-size: 1.2rem;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    list-style: none;
	padding:0;
}


.thumb-box {
	width: 100px;
	height: 100px;
}
.thumb-img {
	width: 100%;
	height:auto;
}

.info-box {
	width: calc( 100% - 100px );
	height: 100px;
	overflow: scroll;
}

.home-blog-date-box {
	width: 100%;
	height: calc( 5px + 1em );
	padding: 5px 5px 0 5px;
	margin: 0;
	
}

.home-blog-date-box i {
	font-size: 0.7em;
}
.home-blog-date-box .date_time {
	display: inline;
	font-size: 0.7em;
}
.home-blog-date-box .home-blog-comment-count {
	display: inline;
	font-size: 0.7em;
}

.home-blog-tags-box {
	width: 100%;
	height: calc( 5px + 1em );
	padding: 5px 5px 0 5px;
	margin: 0;
}
.home-blog-tags-box i, .home-blog-tags-box a{
	display: inline;
	font-size: 0.7em;
}

.home-blog-title-box {
	width: 100%;
	padding: 5px 10px 0 10px;
	margin: 0;
/*	height:1em;*/
}


/*===================================
     main album
  ===================================*/
.main-album-outer {
	font-family:    var(--emi-font-type2);
    font-weight:    var(--emi-font-weight);
    color:          var(--emi-main-album-clr);
}
.main-album-inner {
}




















/*===================================
     mobile menu 
  ===================================*/
.menu-mobile {
	pointer-events: none;
	opacity: 0;
	transition: opacity .3s linear;
}
.menu-mobile.is-active {
	pointer-events: auto;
	opacity: 1;
}

.menu-mobile {
	position: fixed;
	top: 50px;
	right: 0;
	z-index: 101;
	width: 100vw;
	height: 100vh;
	display: flex;
	flex-direction: column;
	align-items: center;
	background: #D9A333;
}
.mblmenu-items {
	width: 100%;
}
.mblmenu-item{
	width: 100%;
	height: auto;
	padding: .5em 1em;
	text-align: center;
	color: #fff;
	box-sizing: border-box;
	border-bottom : 1px solid white;
	z-index:99;
}
.mblmenu-item a {
	text-decoration:none;
	line-height:2;
}
.mblmenu-item:hover{
	cursor: pointer;
	background: #AA0000;
}

#menu-sm .mblmenu-item span {
    display:block;
    text-align: center;
}
#menu-sm .mblmenu-item .nav-ruby {
    font-size:0.5em;
}

#menu-sm .mblmenu-item span {
    display: block;
    text-align: center;
}
#menu-sm .mblmenu-item-sub span {
	text-align:left;
	padding-left: 40%;
}


/*===================================
     top big catch
  ===================================*/



.act-btn {
/* 	border: solid 4px red; */
}


/**/
.fig-caption-75p,
.fig-caption-100p {
	margin:0 auto;
	text-align:center;
	background:dimgray;
}
.fig-caption-75p {
	width:75%;
}
.fig-caption-100p {
	width:100%;
}

/*===================================
     News list 
  ===================================*/
.top-news-outer {
	padding: 5px;
	background-color: #e6d8b3;
}

.top-news {
	padding: 0 10px;
}

.news-items {
	display: flex;
}
.news-items p {
	font-size: 1em;
	font-weight: bold;
}

.news-date {
	width: 140px;
}
.news-text {
    border-bottom: solid 1px black;
    margin-inline-start: initial;
}



/*===================================
     Copyright  
  ===================================*/
.copyright-outer {
	background: #e6d8b3;
	padding: 5px;
}

.copyright-inner {
	width: 100%;
}
.cpy-text {
	text-align: center;
}
	
.top-arrow {
	display: none;
	position: fixed;
	bottom: 75px;
	right: 0;
}
.top-arrow a {
	color: #aa0000;
}


/*=====================================
  footer mennu設定
    var(--emi-site-mbl_menu-bar-bk);
======================================*/
#btm-menu-pc {
	display: none;
}
.nav-list {
	display: table;
	padding: 0;
	list-style: none;
	text-align: center;
	background: var(--emi-site-mbl_menu-bar-bk);
	table-layout: fixed;
	width: 100%;
	border-collapse: collapse;
	margin: 0;
}
.nav-item {
	display: table-cell;
	padding: 4px 0px;
}
.nav-item i {
	display: block;
	font-size: 24px;
	color:black;
}
.nav-item a {
	display: block;
    width:100%;
    height: 100%;
}
.nav-item a span {
	display: block;
	font-size: 10px;
	color:black;
	font-size: 13px;
	line-height: 15px;
}
.nav-item {
	border: solid 1px var(--emi-site-mbl_menu-bar-border);
}
.btm-menu-sm {
	display: block;
	position: fixed;
	left: 0;
	bottom: 0;
	z-index:102;
}

.footer-outer {
	margin-top: 60px;
	margin-bottom: 48px;
	position: relative;
}

/* footer sns bar */
.footer-sns {
	overflow: visible;
	position: absolute;
	top: -51px;
	left:50%;
    transform: translateX(-50%);
}

.social-nav {
	display: flex;
}

.social-nav-instagram, .social-nav-twitter, .social-nav-tiktok, .social-nav-instagram, .social-nav-youtube {
	margin-right:18px;
	color: #d9a333;
}


/*===================================
     Service page 
  ===================================*/
.service-outer, .service-opt-outer {
	padding:5px;
/*	background-color: #e6d8b3;*/
	color: white;
}

.service-cmt-txt {
	font-size: 1.2em;
}
.srvc-ruby-text {
	font-size: 0.8em;
}


/*===================================
     Service コース 
  ===================================*/
.srvc-about-blk, .srvc-course-blk, .srvc-flow-txt, .srvc-nowday-blk, .srvc-system-blk, .srvc-listener-blk, .srvc-resv-blk {
	font-size: 1.1rem;
	line-height: 2em;
}

.srvc-price-text-blk, .srvc-price-text-cntnt,
.srvc-price-komikomi-blk, .srvc-price-komikomi-cntnt,
.srvc-price-opt-blk, .srvc-price-opt-cntnt {
	padding: 10px;

}
.srvc-price {
	font-size: 2rem;
	line-height: 2em;
	display: block;
	text-align: center;
}
.srvc-price-ruby {
	font-size: 0.8rem;
	line-height:1.6rem;
}

.srvc-price-komikomi-blk {
}

.srvc-price-komikomi-cntnt {
	padding-left: 1em;
}

.srvc-price-big {
	color:#aa0000;
	font-size:2.2em;
}

/* option */
.srvc-opt-blk {
	background-color: #fff0c7;
	border-radius:10px;
	color:black;
}

.srvc-opt-title {
	margin-left: 1.5rem;
	line-height: 2rem;
}
.srvc-opt-title:before {
  	display: block;
	float: left;
	margin-left: -1rem;
	content: '';
	width:1em;
	height: 1em;
	background: #aa0000;
	border-radius: 50%;
	margin-top:0.5rem;
}

.srvc-opt-txt {
}
.srvc-opt-course span {
	color: #aa0000;
}
/* form 7 */
.wpcf7-text, .wpcf7-textarea, .wpcf7-email, .wpcf7-file, .wpcf7-submit {
  border: 1px solid rgba(201,163,51,0.7);
  margin-bottom:10px;
  color:7
}

.wpcf7-text:focus,
.wpcf7-email:focus {
  outline: 2px solid #3498db;
  outline-offset: 0;
}

span.wpcf7-radio .wpcf7-list-item {
	margin-top:5px;
	display: block;
}
/* — コンタクトフォーム7　送信ボタンのカスタマイズ — */
input.wpcf7-submit {
	padding:1em !important;/* ボタン内の余白 */
	margin:2em 0em !important;/* ボタンの上下の余白 */
	background-color: #aa0000 !important;/* 背景の色 */
	border-radius: 5px !important;/* 角を丸く*/
	color: #fff !important;/* 文字の色*/
	font-size: 18px !important;/* 文字の大きさ */
	font-weight: bold !important;/* 文字の太さ*/
	width: 50%;/* ボタンの横幅*/
	transition:0.5s;/* 背景色が変わるまでの時間*/
	box-shadow: 2px 2px 2px 2px rgba(0,0,0,0.10);/* 薄っすらとボタンにドロップシャドウをかける*/
	text-align:center;
}

input.wpcf7-submit:hover {
	background-color: #d9a333 !important;/* マウスを乗せたときの背景色 */
	color: #fff !important;/* マウスを乗せたときの文字の色 */
}
.wpcf7-not-valid-tip {
	color: red;
}

.btn-submit {
    width: 100%;
    text-align: center;
}

.screen-reader-response {
	display: none;
}


/*===================================
     BLOG　ページ
  ===================================*/
.blog-outer {
	padding: 0 5px;
	margin-top: 50px;
}

/*===================================
     Blog single
  ===================================*/
.blog-single-outer {
	display:block;
	padding: 5px;
	background-color: #e6d8b3;
	color: black;
}

.blog-single-info {
	border-bottom: solid 1px #888;
}

.blog-single-title {
	font-size: 2rem;
	margin-bottom: 15px;
}
.blog-single-tagbox {
}

.blog-single-tagbox a {
color: #666;
    background-color: #fff;
    margin: 0 0.2em 0.5em 0;
    padding: 0.5em;
    text-decoration: none;
    line-height: 1em;
    display: inline-block;
    border: 1px solid #888;
}

.blog-single-twitter {
	margin: 20px;
}
/*--------------------------------------
  コメント
--------------------------------------*/
/*コメントブロック全体のタイトル(H3)*/
.comments {
	color: 			#000;		/*文字色*/
	border: 		none;		/*外枠*/
	line-height: 	1.2rem;		/*改行幅*/
}

/*コメントブロック全体の設定*/
#comment-box {
	border-top:solid 1px #888;			/*外上線*/
	text-align: left;					/*テキスト左詰め*/
	padding: 5px;						/**/
	margin-bottom: 20px;				/*bottom margin */
	color: white;
	
	background-color: #e6d8b3;
	color: black;
}

/*コメントのリスト表示設定*/
#comment-box ol {
	list-style: 		none;		/*ナンバリングなし*/
}

/*コメントの子コメントブロックの設定(中に .comment-body)含む*/
.children {
	margin-left:	20px;		/*左マージン*/
	list-style: 		none;		/*ナンバリングなし*/
}

/*コメントのブロックの設定*/
.comment_body {
	border:solid 1px #d9a333;					/*外枠*/
	border-radius: 		10px;					/*角丸のサイズ*/
	padding: 			10px;					/**/
	margin-top: 		10px;					/**/
	list-style: 		none;					/*ナンバリングなし*/
	position: 			relative;
}

/*コメントのヘッダー部分設定*/
.comment_header {
	position: 			relative;				/*ポジション*/
}

/*コメントアバター設定*/
.comment_header img {
	float:	 			left;					/*左フロート*/
	width: 				50px;					/*幅*/
	height: 			50px;					/*高さ*/
}

/*コメントの日付表示ブロック設定*/
.comment_meta {
	float: left;								/*左フロート*/
	width: auto;								/*幅*/
	width: calc(100% - 50px);					/*(100%-50px)*/
}
.comment_time {
	display:		block;						/*ブロックで表示*/
	font-size: 		70%;						/*文字サイズ*/
	color:			#900;						/*文字色*/
	padding-left: 	10px;						/*左パディング*/
}

/*コメント表示・名前設定*/
.fn {
	display: 		block;						/*ブロックで表示*/
	overflow:		hide;						/*はみ出しは非表示*/
	font-style: 	normal;				
	padding-left: 	10px;						/*左パディング(comment_timeと合わせる)*/
	color: 			#aaaaaa;					/*文字色*/
	line-height: 	1.0;						/*改行幅*/
	font-weight:	bold;						/*ボールド*/
}

/*コメント本文ブロック設定*/
.comment_content {
	display: 		block;						/*ブロックで表示*/
	padding: 		5px;						/*パディング*/
	line-height: 	1.2;						/*改行幅*/
}

.comment-reply-title {
	font-size:1.3em;
	line-height:	1.3em;
}

/*リプライリンクブロック設定*/
.reply {
	text-align: right;							/*表示位置を右へ*/
}

/*リプライボタン設定*/
.reply a {
	border-radius: 		4px;					/*角丸のサイズ*/
	background-color: 	#aa0000;				/*背景色*/
	color: 				#000;					/*文字色*/
	padding:			4px;					/*パディング*/			
}


/*--------------------------------------
  コメント入力フォーム
--------------------------------------*/
/*コメント入力フォームブロック設定*/
#respond {
	border:solid 1px #d9a333;					/*外枠*/
	border-radius: 		10px;					/*角丸のサイズ*/
	margin:				20px 0 0;				/**/
	padding: 			0 10px 0;
}

/*コメント入力フォーム：コメント入力設定*/
.comment-form-comment textarea {
	width: 				100%;					/*幅*/
	height:				100px;					/*高さ*/
}

/*コメント入力フォーム：名前入力設定*/
.comment-form-author input {
	width: 				100%;					/*幅*/
}

/*コメント入力フォーム：メールアドレス入力設定*/
.comment-form-email input {
	width: 				100%;				/*幅*/
	color:				#000;				/*文字色*/
}

/*コメント入力フォーム：キャプチャーコード入力設定*/
#respond input#captcha_code {
	background-color: 	#000;
	color:	#000;
}

/* form */
#respond input, #respond textarea {
  border: 1px solid rgba(0, 0, 0, 0.16);
  border: 1px solid rgba(170, 0, 0, 1);
  border: 1px solid rgba(201, 163, 51, 0.7);
  margin-bottom:10px;
  color: black;
}

/*リプライボタン設定*/
.form-submit .submit {
	border-radius: 		4px;					/*角丸のサイズ*/
	background-color: 	#aa0000;				/*背景色*/
	color: 				white;					/*文字色*/
	padding:			4px;					/*パディング*/			
}


/*===================================
     予約ページ 
  ===================================*/
.resv-outer {
	padding: 5px;
	color:white;
}

/*===================================
     お客様の声ページ
  ===================================*/
.listener-outer {
	padding: 5px;
}
/*お客様の声*/
.main-listener-list
{
}
.main-listener-item {
	width: auto;
	margin: 0 10px 30px 10px;
/*   border: solid 1px #ff69b4; */
	display: block;
  overflow: hidden;
	height: 120px;

    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
}
.main-listener-item:after {
	content: "";
	display: block;
	clear: both;
}

.main-listener-header {
	float: left;
	display: block;
	width: 80px;
	margin: 0;
}
.main-listener-body {
	float: left;
	margin: 0 0 0 20px;
/* 	width: 674px; */
    width: calc(100% - 104px);
}
.main-listener-header a {
	display: block
}
.main-listener-header a:hover {
	opacity: .8
}

.main-listener-img {
	display: block;
	width:  80px;
	height: 80px;
	margin: 0 0 0 0;
}
.main-listener-img img {
	width: 100%;
	height:auto;
/* 	display:none; */
}
.main-listener-header figure {
	margin: 0;
	display: block;
	position: relative;
}

.main-listener-header .main-listener-caption {
	padding: 1px 0 2px;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	color: #fff;
	background-color: rgba(0, 0, 0, 0.5);
	font-weight: 600;
	font-size: 90%;
	text-align: center;
}
.main-listener-date {
	float: left;
	color: #999;
}

.main-listener-item .morebutton {
	float: left;
	font-size:0.75em;
	display:block;
	width:30px;
	margin: 0;
	padding-top:0px;
	padding-bottom:0px;
	text-align:center;
	border:2px solid;
	border-color:#aaaaaa #444444 #444444 #aaaaaa;
	background:#cccccc;
}

.main-listener-item .morebutton:hover{
	background:#777777;
}
/*お客様の声バルーン*/
.main-listener-item .baloon {
	position: relative;
	background: #f0f5e4;
	border: 2px solid #f5aee9;
}
.main-listener-item .baloon:after,.main-listener-item .baloon:before {
	right: 100%;
	top: 30px;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.main-listener-item .baloon:after {
	border-color: rgba(240, 245, 228, 0);
	border-right-color: #f0f5e4;
	border-width: 15px;
	margin-top: -15px;
}
.main-listener-item .baloon:before {
	border-color: rgba(245, 174, 233, 0);
	border-right-color: #f5aee9;
	border-width: 18px;
	margin-top: -18px;
}

.main-listener-item pre {
/* Mozilla */
white-space: -moz-pre-wrap;
/* Opera 4-6 */
white-space: -pre-wrap;
/* Opera 7 */
white-space: -o-pre-wrap;
/* CSS3 */
white-space: pre-wrap;
/* IE 5.5+ */
word-wrap: break-word;
}

/*===================================
     Service  
  ===================================*/
.opt_link {
	color:red;
}

/*=====================================
  18禁のモーダルウインドウ設定
======================================*/

/* confirm */
#confirm.modal {
	display: block;
	position: absolute;
	top: 25vh;
	width: calc(100% - 6px);
	max-width: 480px;
	margin:0 3px;
	z-index: 999;
	text-align:center; 
	border:1px solid #FFF; 
	border-radius:10px;
	padding: 10px 0;
}
.modal h2 {
	display: none;
}
.confirm-title {
	display: none;
}
.confirm-text-blk {
	color: white;
}
.modal img { 
	vertical-align:bottom;
}
.modal p {
	line-height: 1.5em;
	margin-bottom:10px; 
}
.modal a {
	cursor:pointer;
}
.modal a:hover {
	background-color: #d9a333;
}

/* page pop-up */
#js-popup .popup {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
    opacity: 0;
    visibility: hidden;
    transition: .6s;
}

#js-popup .popup.is-show {
    opacity: 0.8;
    visibility: visible;
}

#js-popup .black-background {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgb( 0, 0, 0);
    z-index: 1;
    cursor: pointer;
}


/*===================================
     album  
  ===================================*/
.album-outer {
	padding: 5px;
}
.album-items {
	display:flex;
	flex-wrap: wrap;
	flex-direction: raw;
}
.album-item {
	width: 100%;
	margin-bottom: 20px;
}
.album-item-img {
	width: 100%;
	height: auto;
}
	
.emoji {
    font-family: apple color emoji,segoe ui emoji,noto color emoji,android emoji,emojisymbols,emojione mozilla,twemoji mozilla,segoe ui symbol;
}

.meta-groups {
    border: solid 1px gray;
    margin-bottom: 20px;
    padding: 5px;
}
.meta-group {
    border: solid 1px gray;
    margin-bottom: 20px;
    padding: 5px;
}
.meta-groups-name {
    font-size: 1.2rem;
    text-align: center;
}

@media screen and (min-width: 480px) {
	/* 480px以上に適用されるCSS（タブレット用） */

/*===================================
     Service list 
  ===================================*/
.service-item {
	width: max( 225px, 50% );
/*	background-color: #fbf5f2;*/
}

/*=====================================
  18禁のモーダルウインドウ設定
======================================*/
#confirm.modal {
	margin-left: calc((100% - 480px) / 2);	
}

/*===================================
     album  
  ===================================*/
.album-item {
	width: calc(100% / 3);
}

}
@media screen and (min-width: 960px) {
	/* 960px以上に適用されるCSS（PC用） */

.top-header-h1 {
	font-size:8px;
	width: 100%;
	text-align:right;	
}

.lang-sw-btns {
	position:absolute;
	top:50px;
	right:10px;
	color:white;
	font-size: 1.4rem;
	line-height:1.5rem;
}

#btm-menu-pc {
	display: block;
}

/*===================================
     Service list 
  ===================================*/
.service-item {
	width: max( 225px, 33% );
	background-color: black;
}

/*===================================
     Blog  
  ===================================*/
.blog-item {
	width: 100%;
	height: 150px;
}
.thumb-box {
	width: 150px;
	height: 150px;
}
.thumb-img {
	width: 100%;
	height:auto;
}
.info-box {
	width: calc( 100% - 150px );
	height: 100px;
}

/*===================================
     top headre 
  ===================================*/
.mobile-3m {
	display:none;
}
.menu-pc {
	display: block;
	margin-left:200px;
}
.menu-items {
	display: flex;
	flex-direction: row;
	align-items: center;
}
.menu-item {
	width: calc(100% / 6);
	height:50px;
	line-height:50px;
	text-align:center;
	color: #e6d8b3;
}
.menu-item a {
	display: block;
	width:100%;
	height:100%;
}

.menu-item:hover {
	background-color: #d9a333;
	color: white;
}

/* 以下サブメニュー対策 */
.menu-item:hover .menu-items-sub {	
	display:block;
}

.menu-items-sub {
	display:none;
}

.menu-items-sub .menu-item-sub:first-child {
	border:none;
}

.menu-item-sub {
    background: #aa0000; /*rgba(170,0,0,1);*/
    border-top: solid 1px black;
}

.menu-item-sub:hover {
	background-color: #d9a333;
	color: white;
}

/*=====================================
  footer mennu設定
======================================*/
.btm-menu-sm {
	display: none;
}

.footer-outer {
	margin-bottom: 0;
}






/*===================================
     top queens list
  ===================================*/
.main-queens-img{
margin-top:20px;
margin-left:20px;
width: calc(100% - 40px);
}


/*=====================================
  course list 設定
======================================*/
.top-course-item-low {
    width: 45%;
    max-width: 300px;
    height: 200px;
    margin-top: auto;
}

/*===================================
     course list 
  ===================================*/
.main-course-img{
    width:100%;
margin-top:20px;
margin-left:20px;
width: calc(100% - 40px);
}

}

@media screen and (min-width: 1280px) {
	/* 1280px以上に適用されるCSS（PC用） */
/*===================================
     contents  
  ===================================*/
#contents {
	width: 1280px;
	margin: 0 auto;
}

#btm-menu-pc {
	display: block;
}

/*===================================
     top image
  ===================================*/
.top-images {
	width: auto;
	height: calc( 1024px * 2 / 3 );
}

.top-image {
	width: auto;
	height: 100%;
	display:block;
	margin: 0 auto;
}

/*===================================
     top message 
  ===================================*/
.top-msg-outer {
	width: 1280px;
	margin: 0 auto;
}

/*===================================
     top queens list
  ===================================*/
.main-queens-img{
margin-top:20px;
margin-left:20px;
width: calc(100% - 40px);
}

/*=====================================
  course list 設定
======================================*/
.main-course-items {
    width: 1250px;
}
.main-course-items-min {
    width: 930px;
}


/*=====================================
  queens list 設定
======================================*/
.main-queens-items {
    width: 1250px;
}
.main-queens-items-min {
    width: 930px;
}


}





a.btn{
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1rem 2rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
  border-radius: 0.5rem;
}

.reservation-btn-border-wrap {
  display: inline-block;
  padding: 0.2rem;
  border-radius: 0.5rem;

  background-image: -webkit-linear-gradient(
    315deg,
    #704308 0%,
    #ffce08 37%,
    #fefeb2 47%,
    #fafad6 50%,
    #fefeb2 53%,
    #e1ce08 63%,
    #704308 100%
  );
  background-image: linear-gradient(
    135deg,
    #704308 0%,
    #ffce08 37%,
    #fefeb2 47%,
    #fafad6 50%,
    #fefeb2 53%,
    #e1ce08 63%,
    #704308 100%
  );
}

.reservation-btn-border:hover a.btn {
  text-shadow: 0 0 15px rgba(250, 250, 214, 0.5),
    0 0 15px rgba(250, 250, 214, 0.5), 0 0 15px rgba(250, 250, 214, 0.5),
    0 0 15px rgba(250, 250, 214, 0.5);
}

a.reservation-btn-border {
  font-size: 2rem;
  background: #000;
}

.reservation-btn-text {
/*  font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro",
    "Hiragino Mincho ProN", "HGS明朝E", "ＭＳ Ｐ明朝", serif;*/

  background: -webkit-gradient(
    linear,
    left bottom,
    left top,
    from(#ffffdb),
    to(#a16422)
  );

  background: -webkit-linear-gradient(bottom, #ffffdb, #a16422);

  background: linear-gradient(to top, #ffffdb, #a16422);
  -webkit-background-clip: text;

  -webkit-text-fill-color: transparent;
}