@charset "UTF-8";
/* CSS Document */



/*------------------------------------------------------------------------------------------------
    index
--------------------------------------------------------------------------------------------------*/

.index-cont-box .img{
	position: relative
}
.index-cont-box .img .name{
	position: absolute;
	top:2em;
	left:-1em;
	height:50px;
	font-size:1.3rem;
	font-weight: 700;
	line-height: 1.2;
	padding: 0 2em;
	border-radius: 25px;
	display: flex;
	align-items:baseline;
	justify-content: center;
}
.index-cont-box.reverse .img .name{
	left:auto;
	right:-1em
}

.index-cont-box .img .name span{
	font-size:3.5rem
}
.index-cont-box.f1 .img .name{
	background:rgba(236,238,199,0.85)
}
.index-cont-box.f2 .img .name{
	background:rgba(209,229,204,0.85)
}
.index-cont-box.dl .img .name{
	background:rgba(246,231,232,0.85);
	font-size:1.5rem;
	align-items:center;
	
}
.btn-lower-index{
	margin:0 0 0 auto
}

.backnumber-wrap {
	width:50%;
	margin: 80px auto 0
}
.backnumber-wrap .btn-b a{
	border: 2px solid #0078A3;
	background: #fff;
	color:#0078A3;
	background-image: url("../images/common/arrow-blue.svg");
	background-position: right 0.8em center;
	background-repeat: no-repeat;
	background-size: 16px 8px;
	outline-color: #0078A3;
}
.backnumber-wrap .btn-b:first-child{
	margin-bottom: 20px
}

@media screen and (max-width: 767px) {
	.index-cont-box .img .name{
		height:8vw;
		font-size:2.8vw;
		border-radius: 4vw;
		top:3vw;
		left:-10vw;
	}
	.index-cont-box.reverse .img .name{
		left:auto;
		right:-10vw;
	}
	.index-cont-box .img .name span{
			font-size:5vw
	}
	.backnumber-wrap {
		width:100%;
		margin: 10vw auto 0
	}
	.backnumber-wrap .btn-b a{
		background-size: 4vw 2vw
	}
	.backnumber-wrap .btn-b:first-child{
		margin-bottom: 4vw
	}
}



/*------------------------------------------------------------------------------------------------
    上付き下付き
--------------------------------------------------------------------------------------------------*/

.super_txt{	
	vertical-align: super;
	font-size:0.6em
}
.baseline_txt{	
	vertical-align: baseline;
	font-size:0.6em
}

[data-ruby] {
    position: relative;
}
[data-ruby]::before {
    content: attr(data-ruby);
    position: absolute;
    top: -1.6em;
	left: calc(50% - 3em);
	margin: auto;
	width:6em;
	text-align: center;
	white-space: nowrap;
	-webkit-transform:scale(0.5);
	transform:scale(0.5);
}


/*------------------------------------------------------------------------------------------------
    下層 共通
--------------------------------------------------------------------------------------------------*/

.h1-wrap{
	padding-bottom: 5%
}
.h1-wrap h1{
	font-size:3.3vw;
	font-weight: 700;
	padding-left:2%;
	white-space: nowrap;
	line-height: 1.2
}
.h1-wrap h1 span{
	font-size:2.0vw;
}

.h1-wrap .feature-ttl-txt{
	width:6.8vw;
	max-width: 80px;
	height:6.8vw;
	max-height:  80px;
	background: #E4ADAC;
	border-radius: 50%;
	color:#fff;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	position: relative
}
.h1-wrap .feature-ttl-txt .txt-ja{font-size:1.08vw;}
/*.h1-wrap .feature-ttl-txt .txt-en{font-size:0.7vw;font-weight: 500;letter-spacing: 0.1em}*/
.h1-wrap .feature-ttl-txt .txt-no{font-size:3.08vw;line-height: 1}

.h1-wrap .feature-ttl-txt::after{
	position: absolute;
	content:'';
	width:75%;
	height:100%;
	top:-5%;
	left:-52%;
	background-image: url("../images/specialfeature/deco-ttl.svg");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: top left
}
@media screen and (min-width:1200px) {
.h1-wrap{
	
}
.h1-wrap h1{font-size:4.0rem;}
.h1-wrap h1 span{font-size:3.0rem;}
	
.h1-wrap .feature-ttl-txt .txt-ja{font-size:1.3rem;font-weight: 500}
.h1-wrap .feature-ttl-txt .txt-en{font-size:0.9rem;font-weight: 500;letter-spacing: 0.1em}
.h1-wrap .feature-ttl-txt .txt-no{font-size:3.7rem;line-height: 1}
}
@media screen and (max-width: 768px) {

	.h1-wrap{
		display: flex;
		align-items: center;

	}
	.h1-wrap h1{
		font-size:4.8vw;
		padding-left:1vw;
		text-shadow: 1px 1px 3px #fff,-1px -1px 3px #fff,1px 1px 3px #fff,-1px -1px 3px #fff,1px 1px 3px #fff,-1px -1px 3px #fff;

	}
	.h1-wrap h1 span{
		padding-left:1vw;
		font-size:3.8vw;
	}

	.h1-wrap .feature-ttl-txt{
		width:10vw;
		max-width: inherit;
		height:10vw;
		max-height:  inherit;
		margin-bottom: 5vw;
		line-height: 1
	}
	.h1-wrap .feature-ttl-txt .txt-ja{font-size:2.4vw;}
	/*.h1-wrap .feature-ttl-txt .txt-en{font-size:1.8vw;font-weight: 500;letter-spacing: 0em}*/
	.h1-wrap .feature-ttl-txt .txt-no{font-size:4.6vw;}
}