/***************************
 *
 * 固定ページ
 * ★ページ中身用★
 *
 **************************/
@media all and (max-width: 768px) {

/*
PAGE HEADER
*/
.page-header {
	padding: 50px 0 50px;
	position: relative;
	background: url(../img/bg-page-header-system.jpg) center center no-repeat;
	background-size: cover;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	flex-direction: column;
	-webkit-justify-content: center;
	justify-content: center;
	margin: 0 !important;	
}
.page-header:after {
	content: "";
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 2;
	background: rgba(0,0,0,0.5);
}
.page-header .page-header-title {
	color: white;
	font-size: 15px;
	font-weight: 500;
	text-align: center;
	position: relative;
	z-index: 3;
}
.page-header .page-header-title-en {
	color: white;
	font-size: 30px;
	text-align: center;
	position: relative;
	text-transform: uppercase;
	z-index: 3;
	line-height: 1;
	margin-bottom: 0px;
}
.page-header .page-header-title-en:first-letter {
	color: #b28850;
}

/*
PAGE
*/
.page {
	line-height: 2em;
	color: #222222;
	font-size: 15px;
	position: relative;
}
.page.page-blog {
	padding-top: 30px;
}
.page.page-blog > .box-content {
	padding: 0 15pxx;
	margin: 0 auto;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;	
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;	
}
.page.page-blog .box-content .page-r {
	width: 100%;
	order: 1;
	box-sizing: border-box;
	padding: 0 15px;
}
.page.page-blog .box-content .page-l {
	width: 100%;
	order: 2;
	box-sizing: border-box;
	padding: 30px 15px;
}
.page.page-cast {
	padding: 30px 0px 30px;
}
.page.page-cast > .box-content {
	padding: 0px 15px;
	margin: 0 auto;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;	
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;	
}
.page.page-cast .box-content .page-r {
	width: 100%;
	order: 1;
}
.page.page-cast .box-content .page-l {
	width: 100%;
	order: 2;
}


.page .box-content {

	margin: 0 auto;
}
.page .bg-silver {
	position: relative;
	padding: 30px 15px 30px;
}
.page .bg-brown {
	position: relative;
	padding: 30px 15px 30px;
	background: url(../img/bg-brown.png) 0 0 repeat;
	background-size: 150px 136px;
}
.page .box-white {
	background: white;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
	padding: 15px;
	box-sizing: border-box;
	position: relative;
	margin: 0 0 30px;
}
.page a {
	color: #4177ad;
	text-decoration: underline;
}
.page a:hover {
	text-decoration: none;
}
.page p {
	color: #222222;
	font-size: 15px;
	margin-bottom: 30px;
}
.page .catch-p {
	text-align: center;
	font-size: 20px;
}
.page .catch-p-2 {
	text-align: center;
	font-size: 17px;
	padding-top: 30px;
	margin-bottom: 20px;
}

.page h2 {
	margin-bottom: -5px;
}
.page h2:first-child {
	margin-top: 0;
}
.page .title-en {
	text-align: center;
	font-size: 25px;
	color: #b28850;
	font-weight: bold;
	margin: 0 auto 10px;
	line-height: 1.2em;
}
.page .title-en + .title-caption {
	text-align: center;
	font-size: 16px;
	color: #222222;
	font-weight: 500;
	margin-bottom: 15px;
	line-height: 1.5em;
}
.query-count {
	margin-top: -30px;
}
.page .title-bar {
	font-size: 18px;
	color: white;
	background: url(../img/bg-title-bar.jpg) 0 0 no-repeat;
	background-size: cover;
	line-height: 1.5em;
	padding-top: 15px;
	padding-bottom: 15px;
	padding-left: 50px;
	margin: 30px auto 20px;
	position: relative;
}
.page .title-bar .small {
	font-size: 11px;
	display: block;
}
.page .title-bar .ic-heart {
	top: -2px;
	margin-right: 0px;
	position: absolute;
	left: 5px;
	top: 5px;
}
.page .title-jp {
	text-align: center;
	font-size: 22px;
	color: #222222;
	font-weight: normal;
	margin: 0 auto 20px;
	line-height: 1.2em;
}
.page h3 {
	text-align: left;
	font-size: 20px;
	font-weight: 500;
	color: #222222;
	margin: 40px 0 20px;
}
.page h4 {
	text-align: left;
	font-size: 18px;
	font-weight: 500;
	color: #a1bb6b;
	margin: 40px 0 20px;
}
.page h5 {
	text-align: left;
	font-size: 18px;
	font-weight: 500;
	color: #222222;
	margin: 40px 0 15px;
	background: url(../img/bg-h5.png) left 18px no-repeat;
	padding-left: 20px;
}

.table-1 {
	width: 100%;
	margin: 30px auto;
}
.table-1 th {
	color: #4177ad;
	border: 1px solid #e5e8ea;
	padding: 15px;
	background: #f1f6fb;

}
.table-1 td {

	border: 1px solid #e5e8ea;
	padding: 15px;
}

.table-2 {
	width: 100%;
	margin: 30px auto;
}
.table-2 th {
	font-size: 16px;
	color: #222222;
	border: 1px solid #f3f1ed;
	padding: 15px;
	background: #f9f8f6;
}
.table-2 td {
	font-size: 16px;
	color: #222222;
	border: 1px solid #f3f1ed;
	padding: 15px;
}
.table-2 tr:nth-child(odd) td {
	background: #fdfcfb;
}
.table-fix th {
	box-sizing: border-box;
	width: 50%;
}
.table-fix td {
	text-align: right;
}
.table-service th {
	width: 335px;
	box-sizing: border-box;
}
.table-service td {
	text-align: right;
}

hr {
	border: none;
	border-top: 1px solid #eeeeee;
	margin: 40px auto;
	clear: both;
}
.center {
	text-align: center;
}
.right {
	text-align: right;
}
.left {
	text-align: left !important;
}
.middle {
	vertical-align: middle;
}
.alignleft {
	float: left;
	margin-right: 30px;
	margin-bottom: 30px;
}
.alignright {
	float: right;
	margin-left: 30px;
	margin-bottom: 30px;
}
.aligncenter {
	display: block;
	margin: 30px auto;
}

.page ol.list {
	margin-bottom: 30px;
	counter-reset: number;
}
.page ol.list > li {
	font-weight: normal;
	color: #4177ad;
	margin-bottom: 15px;
	padding-left: 25px;
	position: relative;
}
.page ol.list > li:before {
	counter-increment: number;
	content: counter(number)"."; 	
	position: absolute;
	left: 5px;
	top: 0px;

	color: #4177ad;	
}
.page ul.list {
	margin-bottom: 30px;
}
.page ul.list > li {
	font-weight: normal;
	color: #4177ad;

	padding-left: 20px;
	position: relative;
	line-height: 2em;
	margin-bottom: 15px;
}
.page ul.list > li:before {
	content: "●";	
	position: absolute;
	left: 5px;
	top: 1px;
	font-size: 8px;
	color: #4177ad;	
}

.list-anchor {
	position: relative;
	border: none;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;	
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	margin: 0 20px 40px;	
	box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
}
.list-anchor > li {
	width: 25%;
}
.list-anchor li > a {
	border: 1px solid #dddddd;
	border-right: none;
	background: white;
	text-align: center;
	display: block;
	width: 100%;
	height: 100%;
	box-sizing: border-box;	
	text-decoration: none!important;
	color: #222222;
	line-height: 50px;
	font-size: 18px;
}
.list-anchor li:hover a, .list-anchor li a.selected {
	background: url(../img/bg-anchor-hover.jpg) center center no-repeat;
	background-size: cover;
}
.list-anchor li:hover *, .list-anchor li a.selected * {
	color: white;
}
.list-anchor li a:hover {
	border: none !important;
	text-decoration: none!important;
	
}

/* column */
.col-2 {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;	
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	margin: 35px auto;	
}
.col-2 > div {
	width: 480px;
}
.col-2 .caption {
	text-align: center;
	margin-bottom: 0;
	font-size: 14px;
}
.page .pic {
	text-align: center;
}
.col-3 {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;	
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	margin: 35px auto;	
}
.col-3 .caption {
	margin-bottom: 0;
	font-size: 14px;
}
.col-3 > div {
	width: 300px;
}
.col-4 {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;	
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	margin: 35px auto;	
}
.col-4 > div {
	width: 220px;
}

.box-gray {
	background: #f9f8f6;
	margin: 40px auto;
	padding: 30px;
}
.box-gray h3:first-child {
	margin-top: 0;
	margin-bottom: 15px;
}
.box-gray p:last-child {
	margin-bottom: 0;
}
.box-gray ul, .box-gray ol, .box-gray ul > li:last-child, .box-gray ol > li:last-child {
	margin-bottom: 0 !important;
}

.link {
	margin: 20px 0;
	background: #f6f7fc;
	padding: 10px 20px;
}
.link a {
	font-size: 16px;
	color: #4b5cca;
}

/*
FUKI
*/
.fuki {
	position: relative;
	margin: 40px auto;
	padding-left: 130px;
}
.fuki .fuki-pic {
	width: 100px;
	position: absolute;
	left: 0;
	top: 0;
}
.fuki .fuki-text {
	background: #fafafa;
	border: 1px solid #e5e8ea;
	position: relative;
	padding: 25px;
	border-radius: 10px;
}
.fuki .fuki-text:before {
	right: 100%;
	top: 50px;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(229, 232, 234, 0);
	border-right-color: #e5e8ea;
	border-width: 11px;
	margin-top: -11px;	
}
.fuki .fuki-text:after {
	right: 100%;
	top: 50px;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(250, 250, 250, 0);
	border-right-color: #fafafa;
	border-width: 10px;
	margin-top: -10px;	
}
.fuki .fuki-text p {
	margin-bottom: 5px;
}
.fuki .fuki-text p:last-child {
	margin-bottom: 0;
}

.fuki.fuki-2 {
	padding-left: 0;
	padding-right: 130px;
}
.fuki.fuki-2 .fuki-pic {
	position: absolute;
	left: auto;
	right: 0;
}
.fuki.fuki-2 .fuki-text:before {
	left: 100%;
	right: auto;
	top: 50px;
	border-color: rgba(229, 232, 234, 0);
	border-right-color: none;
	border-left-color: #e5e8ea;
	border-width: 11px;
	margin-top: -11px;	
}
.fuki.fuki-2 .fuki-text:after {
	left: 100%;
	right: auto;
	top: 50px;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(250, 250, 250, 0);
	border-right-color: none;
	border-left-color: #fafafa;
	border-width: 10px;
	margin-top: -10px;	
}

/*
FORM
*/
.table-form {
	
}
.table-form tr {
	border-bottom: 1px solid #f3f1ed;
}
.table-form th {
	padding: 25px 25px 25px 0;
}
.table-form td {
	padding: 25px 0;
}
.table-form .required {
	color: #a40000;
}
.table-form input[type="text"] {
	border-radius: 4px;
	border: 1px solid #dedcd8;
	font-size: 18px;
	height: 52px;	
}

hr {
	margin: 45px auto;
}

.box-border {
	border: 6px solid #f1f6fb;
	padding: 25px;
	margin: 35px auto;
}
.box-border ul.list, .box-border ol.list {
	margin-bottom: 0;
}
.box-border ul.list > li:last-child , .box-border ol.list > li:last-child {
	margin-bottom: 0;
}

/*
SYSTEM
*/
.img-wrap-system-1 {
	margin-bottom: 15px;
	position: relative;
}
.box-fee {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;	
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	padding: 10px 0 0;	
}
.box-fee > div:first-child {
	width: 400px;
}
.box-fee > div:last-child {
	width: 410px;
}
.table-fee {
	width: 100%;
}
.table-fee tr {
	border-bottom: 1px dotted #bbbbbb;
}
.table-fee td:first-child {
	width: 50%;
	padding: 10px 15px;
	box-sizing: border-box;
	text-align: left;
	font-size: 14px;
}
.table-fee td {
	width: 50%;
	padding: 10px 15px;
	box-sizing: border-box;
	text-align: right;
	font-size: 14px;
}
.table-fee tr:first-child td {

}
.system-lead {
	margin-top: 20px;
	text-align: right;
	
}
.box-fee-option {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;	
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	padding: 10px 0 0;	
}
.box-fee-option > div {
	width: 100%;
}
.box-fee-option > div .table-fee td:first-child {
	width: 45%;
}
.box-fee-option > div .table-fee td:last-child {
	width: 55%;
}

.box-page-feature {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;	
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;	
}
.box-page-feature > div {
	background: white;
	width: 100%;
	border: 1px solid #b28851;
	box-shadow: 0px 0px 0px 6px white;
	padding: 15px;
	box-sizing: border-box;
	margin-bottom: 20px;
}
.box-oil {
	
}
.box-oil > img:first-child {
	width: 68px;
	display: block;
	margin: 0 auto 15px;
}
.box-oil .box-oil-title {
	text-align: center;
	font-size: 20px;
	font-weight: 500;
	color: #b28850;
	line-height: 1.466em;
	margin: 0 auto 15px;
}
.box-oil p {
	font-size: 16px;
	color: #222222;
	text-align: center;
	line-height: 1.5em;
}
.page .box-oil {

}
.page .box-oil p {
	margin-bottom: 0 !important;
}
.page .box-bonus {
	position: relative;
	padding-bottom: 15px;
}
.page .box-bonus .btn-bottom {
	position: static;
	/*
	margin-left: -7px;
	margin-right: -12px;
	bottom: -7px;
	width: 103.3%;*/
	display: block !important;
}
.page .box-bonus h2 {
	text-align: left;
	font-size: 17px;
	color: #b28850;
	font-weight: 500;
	line-height: 1.38em;
	margin-bottom: 15px;
}
.page .box-bonus p {
	font-size: 15px;
	color: #222222;
	line-height: 1.733em;
	margin-bottom: 20px;
}
.page .box-bonus h2 img {
	float: right;
	width: 60px;
	margin-left: 10px;
}

.applink-title {
	text-align: left;
	border-top: 1px dotted #b9b9b9;
	padding-top: 20px;
	margin-bottom: 0 !important;
	
}
.list-applink {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;	
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	margin: 5px auto 20px;	
}

.page .list-applink > li {
	width: 49%;
}

.page  .box-bonus .qr-p {
	margin-bottom: 0;
	position: relative;
	text-align: center;
}
.page  .box-bonus .qr-p .qr-1 {
	position: absolute;
	left: 0;
	top: 0;
	width: 69px;
}
.page  .box-bonus .qr-p .qr-2 {
	position: absolute;
	right: 0;
	top: 0;
	width: 69px;
}

.shopcode {
	font-size: 14px;
	margin: 0 !important;
	position: relative;

	line-height: 1.4em !important;
	text-align: center;
}
.shopcode .num {
	font-size: 30px;
	color: #b28850;
	display: block;
	text-align: center;
	font-weight: bold;
	margin-bottom: 10px;
}

/* box-bonus-big */
.page .box-bonus.box-bonus-big {
	width: 100%;
	padding: 15px;

}
.page .box-bonus.box-bonus-big h2 {
	font-size: 17px;
}
.page .box-bonus.box-bonus-big h2 img {
	width: 70px;
}
.page .box-bonus.box-bonus-big .list-applink {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;	
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;	
}
.page .box-bonus.box-bonus-big .list-applink > li {
	width: 100%;
	position: relative;
	padding-right: 55px;
}
.page .box-bonus.box-bonus-big .list-applink > li:nth-child(1) {

}
.page .box-bonus.box-bonus-big .list-applink a > img {

}
.page .box-bonus.box-bonus-big .list-applink .qr-1 {
	width: 49px;
	position: absolute;
	right: 0;
	top: 30px;
}
.page .box-bonus.box-bonus-big .list-applink .qr-2 {
	width: 49px;
	position: absolute;
	right: 0;
	top: 30px;
}

ol.list-flow {
	
}
ol.list-flow > li {
	border-bottom: 1px dotted #b8b8b8;
	padding: 20px 0 20px 40px;
	position: relative;
}
ol.list-flow p {
	font-size: 16px;
	line-height: 1.875em;
	margin: 0;
}
ol.list-flow .flow-num {
	position: absolute;
	left: 0;
	top: 30px;
	font-size: 20px;
	text-align: center;
	color: white;
	width: 30px;
	height: 30px;
	border-radius: 100%;
	line-height: 30px;
	background: #ba925c; /* Old browsers */
	background: -moz-linear-gradient(top,  #ba925c 0%, #a97d46 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #ba925c 0%,#a97d46 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #ba925c 0%,#a97d46 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

	
	
}
ol.list-flow .flow-title {
	padding-top: 5px;
	margin: 0 0 10px;
	font-size: 18px;
	color: #b28850;
}
.page .main-notice {
	margin: 0;
}
.page .main-notice p {
	color: #ccc;
}
.page .banners-m .box-content {

	margin: 0 auto;
}

.box-news-gra {
	background: url(../img/bg-box-news-gra.png) center center no-repeat;
	background-size: cover;
	padding: 15px 15px 50px;
	box-sizing: border-box;

}
.box-news-gra p {
	margin-bottom: 0;
}
.box-news-gra .list-news .news .news-title a {
	color: white;
}
.box-news-gra .btn a {
	color: white;
}


/*
BANNERS SLIDE
*/
.banners-slide {
	background: white;
	padding: 30px 15px 15px;
}
.list-banners-slide {
	
}
.list-banners-slide .item {

	text-align: center;
}

/*
RESERVE
*/
.page .p-tel {
	margin-bottom: 0;
}
.p-tel span {
	display: block;
	text-align: center;
	color: #222222;
	font-size: 14px;
}
.p-tel span.gold {
	font-size: 20px;
	color: #b28850;
}
.p-tel a {
	display: block;
	text-align: center;
	font-size: 26px;
	color: #b28850;	
	font-weight: bold;
	text-decoration: none;
}
.p-tel a i {
	font-size: 26px;
}

.col-2 > .box-white {

}

.pic-line {
	display: block;
	width: 170px;
	margin: 0 auto 20px;
}
.text-app {
	position: relative;
	padding-left: 130px;
}
.text-app h3 {
	margin-top: 0 !important;
}
.pic-app {
	display: block;
	width: 101px;
	margin: 0;
	position: absolute;
	left: 0;
	top: 0;
}

/*
SCHEDULE
*/
.list-sc {
	position: relative;
	border: none;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;	
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	margin: 0 30px 20px;	
	box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
}
.list-sc li {
	float: none;
	margin: 0;
	padding: 0;
	display: block;
	width: 14.28%;
		
}

.list-sc li > a {
	border: 1px solid #dddddd;
	border-right: none;
	background: white;
	text-align: center;
	display: block;
	width: 100%;
	height: 100%;
	box-sizing: border-box;	
	text-decoration: none!important;
	color: #222222;
	padding-bottom: 10px;
}
.list-sc li:hover a, .list-sc li a.selected {
	background: url(../img/bg-sc-hover.png) center center no-repeat;
	background-size: cover;
}
.list-sc li:hover *, .list-sc li a.selected * {
	color: white;
}
.list-sc li a:hover {
	border: none !important;
	text-decoration: none!important;
	
}
.list-sc li a.active {
	border: none !important;
}
.list-sc li > a .month {
	font-size: 10px;
}
.list-sc li > a .day {
	font-size: 10px;
}
.list-sc li > a .date {
	display: block;
	font-size: 10px;
}

.list-sc .week-prev {
	position: absolute;
	left:  -40px;
	top: 10px;
	width: 36px;
	height: 36px;
}
.list-sc .week-prev a {
	display: block;
	text-indent: -9999em;
	background: url(../img/sc-prev.png) center center no-repeat;
	background-size: contain;
	width: 36px;
	height: 36px;
	border: none;
}
.list-sc .week-prev a:hover {
	background: url(../img/sc-prev.png) center center no-repeat;
	background-size: contain;
	opacity: 0.7;
}
.list-sc .week-next {
	position: absolute;
	right: -40px;
	top: 10px;
	width: 36px;
	height: 36px;
}
.list-sc .week-next a {
	display: block;
	text-indent: -9999em;
	background: url(../img/sc-next.png) center center no-repeat;
	background-size: contain;
	width: 36px;
	height: 36px;
	border: none;
}
.list-sc .week-next a:hover {
	background: url(../img/sc-next.png) center center no-repeat;
	background-size: contain;
	opacity: 0.7;
}
#schedule-display-date {
	position: relative;
}
#schedule-display-date .date {
	font-size: 18px;
	color: #222222;
}
#schedule-display-date .n {
	position: absolute;
	right: 0;
	top: 0;
	font-size: 15px;
	color: #222222;
	text-align: right;
	display: block;
}
#cast-order-lists {
	display: none;
}
#cast-sort-lists li a {
	display: inline-block;
	font-size: 18px;
	color: #222222;
	border: none;
	border-bottom: 1px solid rgba(255,255,255,0);
	text-decoration: none;
	
}
#cast-sort-lists li a.selected {
	font-size: 18px;
	color: #b28850;
	border-bottom: 1px solid #b28850;
}
#cast-sort-lists li a:hover {
	text-decoration: none;
	border-bottom: 1px solid #b28850;
}
#cast-sort-lists > li:nth-child(n + 4) {
	display: none;
}

/*
ACCESS
*/
.box-white .col-2 > div {
	width: 420px;
}

/*
LIST
*/
.box-content.box-content-list {

	margin: 0 auto;
	padding: 30px 15px 30px;
}
.box-content.box-content-list .list-cast {
	padding-top: 35px;
}
#cast-order-lists + .tinynav_label {
	display: none !important;
}
#cast-order-lists {
	display: none !important;
}
select.tinynav {
	display: none;
}
select.tinynav + .query-count {
	display: none;
}
#cast-sort-lists {
	display: block !important;
}

}