/* ---------------------------------------------------------------
start SDGS CSS
--------------------------------------------------------------- */


.bg_pagettl_sdgs {
	width: 100%;
	height: 60vw;
	max-height: 500px;
	margin: 0;
	padding: 0;
	background-size: cover;
	background-position: center bottom;
	display: flex;
	justify-content: center;
	background-image: url(../img/sdgs/bg_pagettl.jpg);
	background-repeat: no-repeat;
}

.bg_pagettl_sdgs .col_pagettl {
	margin: 0;
	padding: 120px 0 0;
	color: #1d4b8b;
	text-align: center;
}

.bg_pagettl_sdgs .col_pagettl div {
	width: 538px;
	margin: 0 auto 70px;
}

.bg_pagettl_sdgs .col_pagettl .jp {
	margin: 0;
	padding: 0;
	font-size: 40px;
	font-weight: 500;
	line-height: 1.4;
}

.bg_sdgs1 {
	width: 100%;
	background-color: #f2f1ea;
	padding: 95px 0 110px;
}

.col_sdgs1 {
	max-width: 992px;
	width: 92%;
	margin: 0 auto;
	}

.mds_sdgs1 {
	margin: 0 0 60px;
	padding: 0;
	font-weight: 600;
	line-height: 1.2;
	text-indent: 0.2em;
	text-align: center;
}

.mds_sdgs1 .ja {
	margin: 0 0 10px;
	color: #000;
	font-size: 30px;
	letter-spacing: 0.3em;
	display: block;
}

.mds_sdgs1 .en {
	color: #1d4b95;
	font-size: 16px;
	letter-spacing: 0.2em;
	display: block;
}

.lead_sdgs1 {
	margin: 0 0 90px;
	font-weight: 500;
	color: #4d4d4d;
	line-height: 2;
	letter-spacing: 0.1em;
	text-align: center;
}

.col_sdgs1 .bg_white {
	width: 100%;
	padding: 60px 0 85px;
	margin: 0 0 27px;
	background-color: #fff;
}

.mds_sdgs2 {
	width: 88%;
	margin: 0 auto 40px;
	padding: 0;
	font-size: 30px;
	letter-spacing: 0.14em;
	text-align: center;
	line-height: 1.5;
}

.col_sdgs1 .cont {
	max-width: 834px;
	width: 86%;
	margin: 0 auto;
	display: flex;
}

.col_sdgs1 .cont .img{
	width: 368px;
	padding: 0 60px 0 0;
}

.col_sdgs1 .cont .txt{
	width: calc( 100% - 368px );
	font-weight: 500;
}

.col_sdgs1 .cont .txt p.txt_marathon {
	margin: 0 0 90px;
}

.col_sdgs1 .cont .txt p{
	margin: 0 0 20px;
	line-height: 1.9;
}

.col_sdgs1 .cont .img .inner_marathon {
	width: 195px;
	margin:  0 0 0 55px;
	padding: 0;
	display: block;
}

.col_sdgs1 .cont .img .inner_eco {
	width: 187px;
	margin:  0 0 0 50px;
	padding: 0;
	display: block;
}

.img_sdgs1 {
	width: 100px;
}

.img_sdgs3 {
	width: 318px;
}

.img_sdgs4 {
	width: 425px;
}

.col_sdgs2 {
	max-width: 748px;
	width: 88%;
	margin: 0 auto;
	padding: 70px 0 80px;
}
	
.mds_sdgs2.about {
	margin: 0 auto 20px;
}
	
.txt_sdgs2 {
	padding: 0;
	margin: 0 0 42px;
	line-height: 2.1;
	letter-spacing: 0.1em;
	text-align: center;
}

.img_sdgs2 {
	margin: 0 auto 50px;
}	

.btn_sdgs {
	width: 350px;
	height: 68px;
	margin: 0 auto;
	color: #fff;
	font-size: 15px;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-decoration: none;
	line-height: 1.6;
	background-color: #4d4d4d;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	transition: .2s;
}

.btn_sdgs span {
	font-size: 13px;
	display: block;
}



/* ---------------------------------------------------------------
	start max 1033px
--------------------------------------------------------------- */

@media screen and ( max-width: 1033px ) {


	.col_sdgs1 .cont .img{
		padding: 0 50px 0 0;
	}

	.col_sdgs1 .cont .img .inner_marathon {
		width: 195px;
		margin:  0 auto 0;
	}

	.img_sdgs4 {
		width: 345px;
	}


}

/* ---------------------------------------------------------------
	end max 1033px
--------------------------------------------------------------- */

/* ---------------------------------------------------------------
	start max 850px
--------------------------------------------------------------- */

@media screen and ( max-width: 850px ) {

	.bg_pagettl_sdgs {
		height: 50vw;
	}

	.bg_pagettl_sdgs .col_pagettl {
		padding: 100px 0 0;
	}

	.bg_pagettl_sdgs .col_pagettl div {
		width: 400px;
		margin: 0 auto 50px;
	}

	.bg_pagettl_sdgs .col_pagettl .jp {
		font-size: 30px;
	}

	.bg_sdgs1 {
		padding: 75px 0 90px;
	}

	.col_sdgs1 .cont .img{
		width: 310px;
		padding: 0 40px 0 0;
	}

	.col_sdgs1 .cont .txt{
		width: calc( 100% - 310px );
	}

	.img_sdgs1 {
		width: 68px;
	}

	.img_sdgs3 {
		width: 216px;
	}

	.img_sdgs4 {
		width: 277px;
	}



}

/* ---------------------------------------------------------------
	end max 850px
--------------------------------------------------------------- */
/* ---------------------------------------------------------------
	start min 701px
--------------------------------------------------------------- */

@media print,screen and ( min-width: 701px ) {


	.btn_pointcard:hover {
		background-color: #737373;
	}

	ul.list_hotel li a:hover {
	    text-decoration: underline;
	}

	.btn_sdgs:hover {
			background-color: #8c8c8c;
	}

}

/* ---------------------------------------------------------------
	end min 701px
--------------------------------------------------------------- */
/* ---------------------------------------------------------------
	start max 700px
--------------------------------------------------------------- */

@media print,screen and ( max-width: 700px ) {

	.bg_pagettl_sdgs {
		height: 280px;
		background-image: url(../img/sdgs/sp/bg_pagettl.jpg);
		background-repeat: no-repeat;
	}

	.bg_pagettl_sdgs .col_pagettl {
		padding: 80px 0 0;
	}

	.bg_pagettl_sdgs .col_pagettl div {
		width: 360px;
		margin: 0 auto 40px;
	}

	.bg_pagettl_sdgs .col_pagettl .jp {
		font-size: 30px;
	}

	.bg_sdgs1 {
		padding: 40px 0 8px;
	}

	.mds_sdgs1 {
		margin: 0 0 20px;
		line-height: 1.5;
		text-indent: 0.2em;
	}

	.mds_sdgs1 .ja {
		margin: 0 0 5px;
		font-size: 25px;
		letter-spacing: 0.14em;
		line-height: 1.4;
	}

	.mds_sdgs1 .en {
		font-size: 11px;
	}

	.lead_sdgs1 {
		width: 92%;
		margin: 0 auto 40px;
		line-height: 2;
		letter-spacing: 0.1em;
		text-align: left;
		text-align: justify;
	}

	.lead_sdgs1 .iblock {
		display: inline;
	}

	.col_sdgs1 .bg_white {
		width: 100%;
		padding: 33px 0 38px;
		margin: 0 0 65px;
	}

	.mds_sdgs2 {
		margin: 0 auto 20px;
		padding: 0;
		font-size: min( 6.9vw, 25px );
		letter-spacing: 0.14em;
		line-height: 1.36;
	}

	.mds_sdgs2.marathon {
		width: 92%;
		letter-spacing: 0.08em;
	}

	.mds_sdgs2.rice {
		width: 92%;
		letter-spacing: 0.08em;
	}

	.col_sdgs1 .cont {
		width: 88%;
		display: block;
	}

	.col_sdgs1 .cont .img{
		width: 75%;
		padding: 0 0 0 0;
		margin: 0 auto 16px;
	}
	
	.col_sdgs1 .cont .img .inner_eco {
		width: 208px;
		margin:  0 auto;
		padding: 0;
		display: block;
	}

	.col_sdgs1 .cont .txt{
		width: 100%;
		letter-spacing: 0.08em;
	}

	.col_sdgs1 .cont .txt p {
		margin: 0 0 28px;
		padding: 0 5px;
		line-height: 2;
		text-align: justify;
	}
	
	.col_sdgs1 .cont .txt p.txt_marathon {
		margin: 0 0 25px;
	}

	.col_sdgs2 {
		width: 90%;
		padding: 55px 0 60px;
	}
	
	.mds_sdgs2.about {
		margin: 0 auto 15px;
	}
	
	.txt_sdgs2 {
		padding: 0 20px;
		margin: 0 0 35px;
		line-height: 2.1;
		letter-spacing: 0.1em;
		text-align: left;
	}	

	.txt_sdgs2 .iblock {
		display: inline;
	}

	.img_sdgs2 {
		margin: 0 auto 45px;
	}	

	.btn_sdgs {
		width: 290px;
		height: 68px;
	}


}

/* ---------------------------------------------------------------
	end max 700px
--------------------------------------------------------------- */

/* ---------------------------------------------------------------
	start max 450px
--------------------------------------------------------------- */

@media screen and ( max-width: 450px ) {

	.bg_pagettl_sdgs {
		height: 170px;
	}
	
	.bg_pagettl_sdgs .col_pagettl {
		padding: 50px 0 0;
	}

	.bg_pagettl_sdgs .col_pagettl div {
		width: 246px;
		margin: 0 auto 18px;
	}

	.bg_pagettl_sdgs .col_pagettl .jp {
		font-size: 18px;
	}
	
	.col_sdgs1 .bg_white {
		margin: 0 0 30px;
	}
	
	.col_sdgs1 .cont .img{
		width: 100%;
	}



}

/* ---------------------------------------------------------------
	end max 450px
--------------------------------------------------------------- */