@charset "UTF-8";
/* @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@900&display=swap'); */


/**** general ****/

html, body {
	background: url(../images/bg_img.jpg) center;
	color: #000;
	font-size: 16px;
	font-family: -apple-system, blinkMacSystemFont, "Meiryo", "Segoe UI", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "メイリオ", Meiryo, sans-serif;
    line-height: 1.5;
}
* {
	-webkit-box-sizing: inherit;
	box-sizing: inherit;
	background-repeat: no-repeat;
}
.clearfix::after {
	display: table;
	clear: both;
	content: "";
}

.wrap .wrap_inner{
	max-width: 100%;
	width: 865px;
	margin: 0 auto;
    margin-top: 22px!important;
}
/* .inner {
	width: 865px;
	max-width: 100%;
	margin: auto;
} */
.sectionBlock {
	min-width: 980px;
	width: 100%;
	margin: 0 auto;
}

img {
    max-width: 100%;
    height: auto;
}

.sp_only {
	display: none;
}
.clearListf {
	clear: both;
}
a {
	text-decoration: none;
	transition: .5s;
}
a:hover {
	opacity: .8;
}
@media screen and (max-width: 768px) {
	html, body {
		font-size: 13px;
	}
	.wrap .wrap_inner{
		min-width: inherit;
		width: 100%;
        margin-top: 0px!important;
		padding: 0 14px;
		box-sizing: border-box;
	}
    
/*	.wrap img {
		width: 100%;
	}*/
    
	.sectionBlock {
		min-width: inherit;
		width: 100%;
	}
	.sp_only {
		display: block;
	}
	.pc_only {
		display: none;
	}
	.header img {
		width: 100%;
		border: none;
		vertical-align: top;
	}
	.mb40 {
		margin-bottom: 20px;
	}
	.inner {
		max-width: 100%;
		width: 100%;
	}
}

/**** header ****/
/*.headerArea {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	z-index: 999;
	height: 65px;
	background: #000;
	text-align: center;
}
.headerArea .logo {
	display: inline-block;
	width: 128px;
	margin-top: 14px;
	line-height: 0;
}
.headerArea .logo img {
	width: 128px;
}

@media screen and (max-width: 768px) {
	.headerArea {
		height: 55px;
	}
	.headerArea .logo {
		width: 110px;
	}
}*/

/*** footer ****/
/* .footerArea {
	padding: 30px 0;
	background: #000;
	color: #fff;
	font-size: 12px;
	text-align: center;
}

@media screen and (max-width: 768px) {
	.footerArea {
		padding: 15px 0;
		font-size: 8px;
	}
} */

/**** back to top ****/
#back_to_top a {
	display: none;
	position: fixed;
	right: 40px;
	bottom: 40px;
	width: 80px;
	height: 80px;
	border-radius: 7px;
	background: #333 url('../images/icon_arrowUp_white01.png') no-repeat center center;
}

@media screen and (max-width: 768px) {
	#back_to_top a {
		right: 20px;
		bottom: 20px;
		width: 35px;
		height: 35px;
	}
	#back_to_top a:after {
		top: 7px;
		left: 14px;
		padding: 3px;
	}
}

/* MAINVISUAL */
.mainvisual {
	min-width: 980px;
    width: 100%;
	margin: 0 auto;
	background: url(../images/mainvisual_bg.jpg) repeat-x;
}

@media screen and (max-width: 768px) {
    .mainvisual {
		min-width: inherit;
        width: 100%;
		background: none;
    }
	.mainvisual .wrap_inner {
		padding: 0;
	}
}
/* common */
.headTitle {
	position: relative;
	padding: 14px;
	background-image: linear-gradient(to right, #0C387E, #0159A9);
	color: #fff;
	font-size: 42px;
	font-weight: bold;
	text-align: center;
}
.headTitle::before {
	position: absolute;
    top: -4%;
    left: 0;
    width: 100%;
    height: 9.53px;
    background: url(../images/line_01.png) no-repeat center top;
    content: "";
    background-size: 100%;
    transform: translateY(-50%);
}
.section01,
.section02,
.section03 {
	text-align: center;
}
.title02 {
	font-size: 40px;
	font-weight: bold;
}
@media screen and (max-width: 768px) {
	.headTitle {
		font-size: 22px;
	}
	.headTitle::before {
    	top: 2.8%;
		height: 13.3px;
	}
	.title02 {
		font-size: 20px;
	}
}
/* SECTION 01 */
.section01 {
	margin-top: 35px;
}
.title01 {
	position: relative;
    color: #0C387E;
	font-size: 48px;
    font-weight: bold;
}
.title01::before {
	position: absolute;
    top: 58%;
    right: 76%;
    width: 54.61px;
    height: 60.53px;
    background: url(../images/line_left.png) no-repeat center top;
    content: "";
    background-size: 100%;
    transform: translateY(-50%);
}
.title01::after {
	position: absolute;
    top: 58%;
    left: 76%;
    width: 54.61px;
    height: 60.53px;
    background: url(../images/line_right.png) no-repeat center top;
    content: "";
    background-size: 100%;
    transform: translateY(-50%);
}
.txt01 {
	position: relative;
	padding-top: 18px;
	font-size: 30px;
    font-weight: bold;
}
.txt01::after {
	position: absolute;
    left: 50%;
    bottom: -50%;
    width: 750px;
    height: 65px;
    background: url(../images/line_title.png) no-repeat center top;
    content: "";
    background-size: 100%;
    transform: translate(-50%,-50%);
}
.txt01 span {
	display: block;
    color: #0C387E;
    font-size: 36px;
}
.txt02 {
	padding-top: 80px;
    font-size: 30px;
    font-weight: bold;
    text-align: left
}
.txt02 .shop {
    font-size: 40px;
}
.txt02 .red {
    color: #be0002;
    font-size: 40px
}
.txt02 .yellow {
	color: #FFB523;
	font-size: 40px;
}
.txt02 .txtVertical {
	color: #FFB523;
	font-size: 16px;
	writing-mode: vertical-lr;
	text-orientation: upright;
}
.txt02 .blue {
	color: #0C387E;
}
.txt_present {
    text-align: center;
    font-size: 35px;
    font-weight: bold;
}
@media screen and (max-width: 768px) {
    
    .txt02 {
	padding-top: 30px;
}
	.title01 {
		width: 350px;
    	margin: auto;
		font-size: 24px;
	}
	.title01::before {
		top: 58%;
		right: 82%;
		width: 28.61px;
		height: 37.53px;
	}
	.title01::after {
		top: 58%;
		left: 82%;
		width: 28.61px;
		height: 37.53px;
	}
	.txt01,
	.txt02 {
		font-size: 20px;
	}
	.txt01 span {
		font-size: 20px;
	}
	.txt01::after {
		width: 394px;
		height: 39.7px;
        bottom: -50%;
	}
    .txt02 .red {
		font-size: 25px;
	}
	.txt02 .yellow {
		font-size: 25px;
	}
	.txt02 .txtVertical {
		font-size: 10px;
	}
    .txt02 .shop {
        font-size: 25px;
    }
    .txt_present {
        font-size: 25px;
    }
}
/* SECTION 02 */
.section02 {
	margin-top: 40px;
}
.section02 .note {
	padding-top: 25px;
}
.campaignWrap {
    display: flex;
	padding-top: 47px;
    flex-direction: column;
    gap: 100px;
}
.reservation {
    display: flex;
	padding-top: 25px;
    justify-content: space-between;
	flex-wrap: wrap;
}
.campaignContainer {
	/* background: url(../images/item_bg.png) center no-repeat; */
	position: relative;
	width: 100%;
	border: 4px solid #0C387E;
	background: #fff;
	box-sizing: border-box;
}
.campaignBlock {
	position: relative;
}
.reservation .campaignContainer {
	width: 48%;
}
.campaignBlock::after {
	position: absolute;
    top: -8%;
    left: 46.5%;
    width: 65px;
    height: 56px;
    background: url(../images/arrow__bottom.png) no-repeat center top;
    content: "";
    background-size: 100%;
    transform: translateY(-50%);
}
.campaignBlock:nth-child(1)::after {
	display: none;
}
.campaignBlock:nth-child(2)::after {
	top: -14%!important;
}
.campaign div {
	display: flex;
	padding: 20px 10px;
    flex-direction: column;
}
.campaign h2 {
	display: flex;
	position: relative;
	height: 80px;
	padding: 1px 90px 0;
	background: #0C387E;
	color: #fff;
	font-size: 22px;
	font-weight: bold;
	line-height: 1.2;
	justify-content: left!important;
	align-items: center;
}
.campaign h3 {
	display: flex;
	position: relative;
	height: 79px;
	padding: 0 90px 0;
	background-image: url(../images/item_bg_1.png);
	background-position: center;
	color: #fff;
	font-size: 22px;
	font-weight: bold;
	line-height: 1.2;
	justify-content: left!important;
	background-repeat: no-repeat;
	background-size: cover;
	align-items: center;
}
.campaign h3 img,
.campaign h2 img {
	position: absolute;
}
/* .campaign .campaignTitle01 span {
	padding-top: 16px;
}
.campaign .campaignTitle02 span {
	padding-top: 25px;
} */
.campaign .campaignTitle01 img {
    top: -50%;
    left: 2%;
	width: 61.44px;
}
.campaign .campaignTitle02 img {
    top: -39%;
    left: 2%;
	width: 61.44px;
}
.campaign .campaignTitle03 img {
    top: -45%;
    left: 2%;
	width: 61.44px;
}
.campaign .campaignTitle04 {
    padding: 0px;
	justify-content: center !important;
    align-items: center;
}
.txt03 {
	margin-bottom: 22px;
	font-size: 18px;
}
.txt03 span {
	display: block;
	color: #FFB523;
	font-weight: bold;
}
.textAlign {
    height: 196.2px;
}
@media screen and (max-width: 768px) {
	.campaign h3,
	.campaign h2 {
		padding: 0 8px 0;
		/* background: url(../images/item_bg_sp.png) center no-repeat; */
		/* background-size: 100%; */
		background-position: bottom;
        font-size: 19px;
		justify-content: center;
	}
	/* .campaignItem {
		width: 100%;
		margin-bottom: 60px;
	} */
	/* .campaignItem:last-child {
		margin-bottom: 0;
	} */
	.campaign .campaignTitle01 img {
		top: -46%;
		width: 56.44px;
	}
	.campaign .campaignTitle02 img,
	.campaign .campaignTitle03 img  {
		top: -42%;
		width: 56.44px;
	}
	.campaign div {
		justify-content: space-between;
	}

	.campaignBlock::after {
		left: 42.5%;
		width: 50px;
		height: 48px;
	}
	.campaignBlock:nth-child(2)::after {
        top: -11%;
    }
	.campaign .campaignTitle01 span,
	.campaign .campaignTitle02 span,
	.campaign .campaignTitle03 span {
        margin:0 auto;
	}
	.txt03 {
		font-size: 16px;
	}
    .textAlign {
        height: none;
    }
}
/* SECTION 03 */
.section03 {
	position: relative;
	margin-top: 80px;
}

.productsTxt {
	padding-top: 30px;
}
.productsTxt img {
	width: 23.5px;
    height: 46.69px;
	padding-top: 16px;
}
.productsList {
	display: flex;
	padding-top: 31px;
	justify-content: space-between;
	flex-wrap: wrap;
}
.productsItem {
	width: calc(50% - 12px);
	padding-bottom: 12px;
	box-sizing: border-box;
	list-style-type: none
}
.howtouse {
    margin-top: 20px
}
@media screen and (max-width: 768px) {
	.section03 {
		margin-top: 40px;
	}
	.productsTxt img {
		width: 14.5px;
    	height: 38.69px;
		padding-top: 10px;
	}
	.productsList {
		padding-top: 15px;
	}
	.productsItem {
		width: 100%;
	}
}
/* SECTION 04 */
.section04 {
	margin: 40px 0 200px;
}
.details {
	position: relative;
}
.details::after {
	position: absolute;
    bottom: -32%;
    left: 0%;
    width: 100%;
    height: 12.69px;
    background: url(../images/line_02.png) no-repeat center top;
	content: "";
    background-size: 100%;
    transform: translateY(-50%);
}
.titleArrow {
	position: relative;
	color: #CC051B;
	text-align: center;
}
.details .title02 {
	text-align: center;
}
.titleArrow::before {
	position: absolute;
    top: 10%;
    left: 8%;
    width: 23.5px;
    height: 46.69px;
    background: url(../images/arrow.png) no-repeat center top;
	content: "";
    background-size: 100%;
    transform: rotate(-90deg);
}
.titleArrow::after {
	position: absolute;
    top: 10%;
    right: 8%;
    width: 23.5px;
    height: 46.69px;
    background: url(../images/arrow.png) no-repeat center top;
	content: "";
    background-size: 100%;
    transform: rotate(90deg);
}
.detailsItem {
	border: 1px solid #E7E7E7;
	background: #fff;
	list-style-type: none
}
.detailsItem h3 {
    padding: 14px 42px;
	border: 1px solid #E7E7E7;
    background: #808080;
    color: #fff;
    font-size: 40px;
    font-weight: bold;
}
.detailsList {
    width: 98%;
    margin: 1% auto;
}
.info {
	padding: 27px 42px;
	font-size: 24px;
}
.infoTitle {
	font-weight: bold;
	text-decoration: underline;
}
.info p span {
	display: block;
	font-weight: bold;
}
.info p,
.infoItem,
.cancel li {
	padding-bottom: 21px;
}
.infoItem span {
	display: block;
	padding-top: 21px;
}
.cancel li {
	padding-left: 22px;
    text-indent: -6px;
}
.cancel li::before {
	display: inline-block;
    width: 7px;
    height: 7px;
    margin-right: 8px;
    margin-bottom: 3px;
    border-radius: 50%;
    background-color: #000;
    vertical-align: middle;
    content: '';
}
.info p:last-child{
	padding-bottom: 0;
}
.line-left {
	position: relative;
	padding-left: 34px;
}
.line-left span::before {
	position: absolute;
	top: 3%;
    left: 1%;
    width: 7px;
    height: 33px;
    background-color: #000;
	content: '';
}
@media screen and (max-width: 768px) {
	.section04 {
		margin: 40px 0 100px;
	}
	.info p, .infoItem, .cancel li {
		padding-bottom: 10px;
	}
	.details {
		padding-bottom: 15px;
	}
	.detailsItem h3 {
		padding: 7px 21px;
		font-size: 20px;
	}
	.info {
		padding: 13px 21px;
		font-size: 15px;
	}
	.titleArrow {
		width: 350px;
		margin: auto;
	}
	.titleArrow::before {
		top: -17%;
		left: 6%;
		width: 14.5px;
		height: 46.69px;
	}
	.titleArrow::after {
		top: -17%;
		right: 6%;
		width: 14.5px;
		height: 46.69px;
	}
	.cancel li {
		padding-left: 8px;
	}
	.infoItem span {
		padding-top: 10px;
	}
	.line-left {
		padding-left: 19px;
	}
	.line-left span::before {
		width: 5px;
    	height: 20px;
	}
}

.infoItem{
    line-height: 1.5;
}
.line-left{
    line-height: 1.5;
}
.details{
    line-height: 1.1;
}
.info{
    line-height: 1.5;
}
.note{
    line-height: 1.5;
}
.txt03{
    line-height: 1.5;
}
.txt01{
    line-height: 1.5;
}
.cancel li{
    line-height: 1.5;
}
.productsTxt{
    line-height: 1.5;
}

/*231113追加ここから*/

/*.header__search {
    top: 25px!important;
}

.header__search .header__searchBtn {
    height: 52.2px!important;
}

.header__search .header__searchBtn {
    margin-top: -0.35px;
}

.header__iconList {
    margin-top: 35px;
}

.header__iconList>li.header__iconList__otherMenu {
    margin-bottom: 35px!important;
}

@media screen and (max-width: 767px){
.header__search {
    top: 59px !important;
  }
.header__search .header__searchBtn {
    margin-top: 0;
}
  
  .header__search .header__searchBtn {
    height: 36.6px!important;
}
  
}*/

/*231011追加ここまで*/
/*.footer-media{
    display: none;
}*/

/* 261104追加ここから*/
.tab-switch {
  --cstm-tab-color:#005096;
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  margin-inline: auto;
  gap: 2%;
  margin-top: 50px;
}

/* タブボタン */
.tab-switch label {
  padding: 1em;
  background:#eee;
  cursor: pointer;
  order: -1; /* 上に表示 */
  text-align: center;
  font-size: 20px;
  font-weight: bold;
  width: 44.3%;
}

/* ラジオ非表示 */
.tab-switch input {
  display: none;
}

/* コンテンツ非表示 */
.tab-content {
  display: none;
  width: 100%;
}

/* 選択されたタブ＋コンテンツ表示 */
.tab-switch label:has(:checked) {
  background: var(--cstm-tab-color);
  color: #fff;
}
.tab-switch label:has(:checked) + .tab-content {
  display: block;
  border: 5px solid #005096;
}

@media screen and (max-width: 768px) {
  .tab-switch label {
    width: 49%;
    font-size: 15px;
  }
  .tab-switch {
    margin-top: 30px;
  }
}
/* 261104追加ここまで*/