@charset "utf-8";
.campaign .wrap{
	width : 90%
}
.header-campaign-top figure img.sp{
	display : none;
}
.content-title{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	border-bottom : 10px solid #992200;
	padding-bottom : 15px;
	margin-bottom : 15px;
}
.content-title h2{
	position : relative;
	display : block;
	width : 1000px;
	height : auto;
	margin : 0 auto;
}
.content-title h2 img{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
}
.content-info{
	position : relative;
	display : block;
	width : 850px;
	height : auto;
	margin : 0 auto 50px;
}
.content-info p{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	line-height : 2;
	text-align : justify;
	font-size : 20px;
}
.schedule{
	position : relative;
	display : block;
	width : 1000px;
	height : auto;
	margin : 0 auto;
}
.schedule img{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
}
/* # =================================================================
#### ブロックエディタ
# ================================================================= */
.discount-inner{
	position : relative;
	display : block;
	width : 850px;
	height : auto;
	margin : 0 auto 50px;
}
.price-section{
	
}
.price-section h3{
	position : relative;
	display : block;
	width : fit-content;
	height : auto;
	padding-left : 2em;
	line-height : 1;
	color: #992200;
	font-size : 40px;
	font-weight : bold;
	margin-bottom : 30px;
}
.price-section h3 span{
	position : relative;
	display : inline-block;
	width : auto;
	height : auto;
	color : var(--font-color);
	font-size : 22px;
	font-weight : normal;
}
.price-section h3::before{
	content : "";
	position : absolute;
	display : block;
	width : 55px;
	height : 55px;
	aspect-ratio : 1;
	top : 5px;
	right : auto;
	bottom : 0;
	left : 0;
	margin : auto auto;
}
.discount-container:nth-of-type(1) .price-section h3::before{
	background : url(../../images/student-campaign/P02_01.png)center / contain no-repeat;
}
.discount-container:nth-of-type(2) .price-section h3::before{
	background : url(../../images/student-campaign/P02_02.png)center / contain no-repeat;
}
.discount-container:nth-of-type(3) .price-section h3::before{
	background : url(../../images/student-campaign/P02_03.png)center / contain no-repeat;
}
.discount-container:nth-of-type(4) .price-section h3::before{
	background : url(../../images/student-campaign/P02_04-2.png)center / contain no-repeat;
}
/**  **/
.discount-price{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	border-radius : 15px;
	background-color : #FDFBBD;
	padding : 30px;
}
.discount-container:nth-of-type(1) .discount-price:nth-of-type(1){
	margin-bottom : 30px;
}
.discount-container:nth-of-type(1) .discount-price .wp-block-group__inner-container.is-layout-constrained.wp-block-group-is-layout-constrained,
.discount-container:nth-of-type(2) .discount-price .wp-block-group__inner-container.is-layout-constrained.wp-block-group-is-layout-constrained{

	display : flex;
	flex-wrap : wrap;
	justify-content : flex-start;
}
/** 通学プランと併用 **/
.discount-price .mark{
	position : relative;
	display : block;
	width : 175px;
	height : 105px;
	border-radius : 50%;
	background-color : #F25700;
}
.discount-price .mark p{
	position : absolute;
	display : flex;
	flex-direction : column;
	gap : 5px;
	align-items : center;
	justify-content : center;
	top : 0;
	right : 0;
	bottom : 0;
	left : 0;
	margin : auto auto;
	text-align : center;
	height : auto;
	line-height : 1;
	color : #FFF;
	font-size : 50px;
	font-weight : bold;
}
.discount-container:nth-of-type(1) .discount-price:nth-of-type(2) .mark:nth-of-type(1) p,
.discount-container:nth-of-type(2) .discount-price .mark:nth-of-type(1) p{
	font-size : 30px;
	font-weight : bold;
}
.discount-price .mark p span{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	color : #FFF;
	font-size : 20px;
	font-weight : 500;
}

.discount-price p.bold{
	position : relative;
	display : flex;
	flex-wrap : wrap;
	align-items : center;
	width : 100%;
	height : auto;
	border-radius : 0;
	background-color : transparent;
	line-height : 1;
	color : #F25700;
	font-size : 54px;
	font-weight : bold;
	padding-left : 20px;
}
.discount-container:nth-of-type(3) p.bold,
.discount-container:nth-of-type(4) p.bold{
	padding-left : 0;
}
.discount-price p.bold span.small{
	position : relative;
	display : inline-block;
	width : fit-content;
	height : auto;
	font-size : 48px;
	top : 0 !important;;
}
.discount-price p.bold span.small{
	position : relative;
	display : inline-block;
	width : fit-content;
	height : auto;
}
.discount-price p.bold span{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	font-size : 30px;
}
.discount-container:nth-of-type(1) .discount-price p.bold,
.discount-container:nth-of-type(2) .discount-price p.bold{
	width : calc(100% - 200px);
}
.discount-container:nth-of-type(2) .discount-price p.bold{
	top : -5px;
}
.discount-container:nth-of-type(2) .discount-price p.bold span{
	top : 5px;
}
.discount-container:nth-of-type(3) p,
.discount-container:nth-of-type(4) p{
	text-align : center;
	font-size : 22px;
	font-weight : bold;
}
.discount-container:nth-of-type(3) p.bold,
.discount-container:nth-of-type(4) p.bold{
	display : block;
	text-align : center;
	font-size : 40px;
	margin-bottom : 10px;
}

.discount-inner .bus-button,
.discount-inner .fees-button{
	margin : 30px 0 0 auto;
}
/* # =================================================================
#### 横スクロール 枠
# ================================================================= */
.scroll-wrapper{
	position : relative;
	width : 100%;
	overflow : hidden;
}
.scroll-image{
	width : 100%;
	-webkit-overflow-scrolling : touch;
}
.scroll-image figure{
	margin : 0;
	padding : 0;
	width : 100%;
}
.scroll-image img{
	width : 100%;
	height : auto;
	vertical-align : bottom;
	pointer-events : none;
	user-select : none;
	-webkit-user-drag : none;
}
.scroll-wrapper::after,
.scroll-hint-img {
	display : none;
}
/* # =================================================================
#### responsive
# ================================================================= */
/* # =================================================================
#### 1240px
# ================================================================= */
@media screen and (max-width: 1240px){
.campaign .wrap{
	width : 100%;
	padding-right : 0 !important;
	padding-left : 0 !important;
}
.content-info,
.discount-container{
	padding : 0 40px;
}
.schedule{
	padding : 0 15px;
}
.content-title h2{
	width : 90%;
}
.header-campaign-top{
	display : flex;
	flex-wrap : wrap;
	margin-top : 80px;
}
.header-campaign-top figure{
	width : 100%;
}
.header-campaign-top .title{
	position : relative;
	top : auto;
	right : auto;
	bottom : auto;
	left : auto;
	margin : 10px auto 0;
}
.header-campaign-top .title img{
	width : 100%;
}

.schedule{
	width : 100%;
}





}/*** 1240px ***/
/* # =================================================================
#### 1024px
# ================================================================= */
@media screen and (max-width: 1024px){
.content-info,
.discount-inner{
	width : 100%;
}
}/*** 1024px ***/
/* # =================================================================
#### 896px
# ================================================================= */
@media screen and (max-width: 896px){
.discount-price{
	padding : 25px 10px;
}
.discount-price p.bold{
	font-size : 70px;
}
.discount-price p.bold span{
	font-size : 20px;
}
.discount-price p.bold span.small{
	font-size : 26px;
	top : 4px !important;
}
.discount-container:nth-of-type(2) .discount-price p.bold{
	top : -5px;
}
.discount-price .mark{
	width : 130px;
	height : 80px;
}
.discount-price .mark p{
	font-size : 22px;
}
.discount-container:nth-of-type(1) .discount-price:nth-of-type(2) .mark:nth-of-type(1) p,
.discount-container:nth-of-type(2) .discount-price .mark:nth-of-type(1) p{
	font-size : 22px;
}
.discount-price .mark p span{
	font-size : 18px;
}
.discount-container:nth-of-type(3) p,
.discount-container:nth-of-type(4) p{
	font-size : 20x;
}
.discount-container:nth-of-type(1) .discount-price:nth-of-type(1) .mark:nth-of-type(1) p{
	top : -9px;
}
.discount-container:nth-of-type(3) p,
.discount-container:nth-of-type(4) p{
	font-size : 18px;
}
















}/*** 896px ***/
/* # =================================================================
#### 700px
# ================================================================= */
@media screen and (max-width: 700px){
.discount-price p.bold{
	font-size : 45px;
}
}/*** 700px ***/
/* # =================================================================
#### 600px
# ================================================================= */
@media screen and (max-width: 600px){
.header-campaign-top{
	margin-top : 50px;
}
.content-info,
.discount-container{
	padding : 0 15px;
}
.content-info p{
	font-size : 18px;
}
.discount-price p.bold span{
	font-size : 18px;
}
.discount-price p.bold span.small {
	font-size : 18px;
	top : 10px !important;
}

.discount-container:nth-of-type(3) p,
.discount-container:nth-of-type(4) p{
	font-size : 16px;
}
.discount-container:nth-of-type(1) .discount-price:nth-of-type(2) .mark:nth-of-type(1) p,
.discount-container:nth-of-type(2) .discount-price .mark:nth-of-type(1) p{
	font-size : 18px
}

.discount-price .mark{
	width : 100px;
	height : 70px;
}
.discount-price .mark p{
	font-size : 20px;
}
.discount-price .mark p span{
	font-size : 16px;
}
.discount-container:nth-of-type(1) .discount-price p.bold,
.discount-container:nth-of-type(2) .discount-price p.bold{
	width : calc(100% - 120px);
}
.discount-price p.bold{
	padding-left : 15px;
}
/*****  *****/
.price-section h3{
	font-size : 24px;
}
.price-section h3::before{
	width : 40px;
	height : 40px;
}
.price-section h3 span{
	font-size : 14px;
}




.content-title h2{
	width : 100%;
	padding : 0 10px;
}



/* # =================================================================
#### 横スクロール 本体
# ================================================================= */
.scroll-wrapper::after{
	display : block;
	content : "";
	position : absolute;
	top : 0;
	right : 0;
	width : 30px;
	height : 100%;
	background : linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1));
	pointer-events : none;
	z-index : 2;
}
.scroll-image{
	overflow-x : auto;
	cursor : grab;
	-webkit-user-select : none; /* Safari */
	-ms-user-select : none;     /* IE10+ */
	user-select : none;         /* 標準ブラウザ */
}
.scroll-image.is-grabbing{
	cursor : grabbing;
}
.scroll-image figure{
	/* 600px以下になっても中身は600pxを維持（ガチガチ） */
	width : 1000px;
	padding-right : 50px;
}
.scroll-hint-img {
	display : block;
}
.scroll-hint-img{
	position : absolute;
	top : 50%;
	left : 50%;
	transform : translate(-50%, -50%);
	z-index : 3;
	pointer-events : none;
	user-select : none;
	-webkit-user-drag : none;
	transition : opacity 0.5s, visibility 0.5s;
	width : 80px;
}
.scroll-hint-img img{
	width : 100%;
	height : auto;
	opacity : 0.8;
}
#prices-style .credit{
	margin : 30px auto 0;
}
}/*** 600px ***/
/* # =================================================================
#### 480px
# ================================================================= */
@media screen and (max-width: 480px){
.discount-price .mark {
	width : 90px;
	height : 60px;
}
.discount-price p.bold{
	font-size : 46px;
	padding-left : 5px;
}
.discount-price p.bold span{
	font-size : 14px;
}
.discount-price p.bold span.small {
	font-size : 14px;
	top : 5px !important;
}
.discount-container:nth-of-type(3) p,
.discount-container:nth-of-type(4) p{
	font-size : 12px;
}
.discount-price .mark p{
	font-size : 18px;
}
.discount-price .mark p span{
	font-size : 14px;
}
.discount-container:nth-of-type(1) .discount-price:nth-of-type(2) .mark:nth-of-type(1) p,
.discount-container:nth-of-type(2) .discount-price .mark:nth-of-type(1) p{
	font-size : 16px;
}
}/*** 480px ***/
/* # =================================================================
#### 320px
# ================================================================= */
@media screen and (max-width: 320px){
.discount-price p.bold{
	font-size : 38px;
}
}/*** 320px ***/