@charset "UTF-8";

/*---------------------*/
/* メインタイトル */
/*---------------------*/
#main_top .main_ttlArea p,
#main_top .main_ttlArea h2 {
	color: #FFF;
}

/*---------------------*/
/* 共通 */
/*---------------------*/
.txtArea .ttl01 {
    font-family: "garamond-premier-pro", serif;
    font-weight: 400;
    font-style: normal;
    font-size: 40px;
    color: #AEA133;
    text-align: center;
    margin-bottom: 1rem;
}
#themeWrap .txtArea.bot {
	width: 100%;
	max-width: none;
}
.txtArea.bot .ttl01 {
	margin-bottom: 2rem;
}
/* Tablet */
@media only screen and (max-width: 768px) {
.txtArea .ttl01 {
    font-size: 5.208vw;
    margin-bottom: 1rem;
}
.txtArea.bot .ttl01 {
	margin-bottom: 1rem;
}
}

/* sp */
@media only screen and (max-width: 576px) {
.txtArea .ttl01 {
	font-size: 6.944vw;
}	
}

/*---------------------*/
/* ボタン */
/*---------------------*/
.voice_btn{
	width: 76.5%;
	margin: 2.5vw auto 0;
	display: flex;
}
.voice_btn li{
	list-style: none;
}
.center_btn{
	padding-left: 5vw;
	padding-right: 5vw;
}
.voice_btn a : hover{
	opacity: 0.7;
}

@media (max-width: 576px) {
	.voice_btn{
		display: block;
		padding: 10vw 0 0;
	}
	.center_btn{
		padding: 6vw 0;
	}
}

/*---------------------*/
/* 「私たちが好きな”南砂”」 */
/*---------------------*/
#topWrap {
	background: url(../img/position/top_bg.jpg) no-repeat 100% 50%/cover;
}
#topWrap .topCopyArea {
	width: 100%;
	margin: 0 auto;
	padding: 17.5em 0 7em;
	background: url(../img/position/top_bg_kage.png) repeat-x 0% 0%;
}
#topWrap .section_title,
#topWrap .lead {
	color: #191919;
}
#topWrap .erea_map {
	width: 100%;
	max-width: 925px;
	margin: 3rem auto;
}
#topWrap .erea_map > .imageCap {
	width: 100%;
	margin: auto;
}

.imageCap{
	display: flex;
	justify-content: center;
}
.imageCap .br-sp{
	width: 85%;
}

/* Tablet */
@media only screen and (max-width: 768px) {
	#topWrap .topCopyArea {
		width: 100%;
		padding: 10.5em 0 5em;
	}
	#topWrap .topCopyArea .section_title.slash01::before {
		top: -130%;
	}
	#topWrap .erea_map > .imageCap {
		width: 100%;
	}
}
/* sp */
@media only screen and (max-width: 576px) {
	#topWrap .topCopyArea {
		padding: 6.5em 0 3em;
	}
	#topWrap .topCopyArea .section_title.slash01::before {
		top: -110%;
	}
}



/*---------------------*/
/* VOICE. 1 【南砂町ってどんな街？】 */
/*---------------------*/

main{
    background: white;
}

#voice_1{
    background: #fff;
    padding-bottom: 0.6vw;
	padding-top: 10vw;
}

/*---------------------*/
/* VOICE. 2 【通勤や休日のお出かけは？】 */
/*---------------------*/

#voice_2{
    background: #efefef;
    padding-bottom: 0.6vw;
	padding-top: 10vw;
}

.white_back{
    background: #fff;
    padding: 2.5vw 0;
	box-shadow: 0px 0px 5px #222;
	margin-top: 2vw;
}

/*---------------------*/
/* VOICE. 3 【地元のいいところは？】 */
/*---------------------*/

#voice_3{
    background: #fff;
    padding-bottom: 0.6vw;
	padding-top: 10vw;
}

/*---------------------*/
/*メインコンテンツ*/
/*---------------------*/

.main_content{
    width: 90%;
    margin: auto;
}
.main_content p{
    width: 85%;
    margin:auto;
    font-size: 14px;
    letter-spacing: 0.18em;
    line-height: 2;
	padding-bottom: 2vw;
}
.main_content strong{
	font-size: 110%;
	font-weight: bold;
}
.main_content em{
	font-weight: 501;
	background-color: #fff599;
	/* opacity: 0.9; */
}
.main_content img{
    width: 85%;
    display: block;
    margin: auto;
	margin-bottom: 2.5vw;
	position: relative;
	top: -2.5vw;
}

.main_lead{
	text-align: center;
	width: 100%;
}

.gray_back{
    background: #efefef;
    padding: 2.5vw 0;
	box-shadow: 0px 0px 5px #222;
	margin-top: 2vw;
}

.voice_number{
    color: #AEA133;
    font-family: "goldenbook";
    font-size: 25px;
    margin: 15px auto;
    text-align: center;
}
.voice_title{
    color: #191919;
}
.voice_title span{
	white-space: nowrap;
	font-size: clamp(13px, 4vw, 30px);
}

.space{
	margin: 5rem;
}

@media (min-width:769px) {
	.img-sp{
		display: none;
	}
}
@media (max-width:768px) {
	.main_content{
		width: 100%;
	}
	.main_content p{
		width: 90%;
		font-size: 1.8vw;
		line-height: 1.8;
		padding-bottom: 2.4vw;
		letter-spacing: 0.05cap;
	}
	.main_content img{
		width: 90%;
		top: -3vw;
	}

	.main_lead{
		width: 100%;
		text-align: left;
	}

	.img-pc{
		display: none;
	}

	.wide-map{
	width: 100vw;
	margin-top: 1.2rem;
    }
}

@media (min-width:577px) {
	.btn-sp{
		display: none;
	}
}
@media (max-width:576px) {
	#voice_1, #voice_2, #voic3_3{
		padding-top: 20vw;
	}
	.main_content p{
		font-size: 3.125vw;
		padding-bottom: 6vw;
	}

	.white_back, .gray_back{
		padding-top: 8vw;
	}

	.btn-pc{
		display: none;
	}
}