/******************************************************************
サイトコンテンツスタイルシート
Author: T.Sugiyama
Author URI: http://fromdime.com
******************************************************************/

/******************************************************************

共通

******************************************************************/
* {
	font-family: "a-otf-jun-pro", sans-serif;
	font-weight: bold;
	font-style: normal;
}
.f-go {
	font-family: "Noto Sans JP";
	font-weight: normal;
}
.f-min {
	font-family: "Noto Serif JP";
	font-weight: normal;
}
.f-otf-jun-pro {
	font-family: "a-otf-jun-pro", sans-serif;
	font-weight: bold;
	font-style: normal;
}
html {
	font-size: 1.0rem;
}
body.page-sound-logo {
	color: #55aa31;
	background-color: #63af35;
	overflow-x: hidden;
}
.page-sound-logo #wrap-container {
	background-color: #63af35;
}
.page-sound-logo #main a {
	text-decoration: none;
}
.page-sound-logo a:hover,
.page-sound-logo a:focus,
.page-sound-logo a:active {
	opacity: 0.7;
}


/******************************************************************

ヘッダー

******************************************************************/
.page-sound-logo #header {
	background-color: #ffffff;
	background-image: url("assets/images/sound-logo/bg-main-image.webp");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	overflow: hidden;
	position: relative;
}
.page-sound-logo #header:before,
.page-sound-logo #header:after {
	content: "";
	display: block;
	height: 120px;
	width: 100%;
	background-repeat: repeat-x;
	background-size: contain;
}
.page-sound-logo #header:before {
	background-image: url("assets/images/sound-logo/bg-main-image-upper.webp");
	background-position: center top;
}
.page-sound-logo #header:after {
	background-image: url("assets/images/sound-logo/bg-main-image-lower.webp");
	background-position: center bottom;
}
.page-sound-logo #header .logo-wrapper {
	position: absolute;
	top: 0;
	left: 5%;
	width: 100%;
	max-width: 180px;
    text-align: center;
    background-color: #ffffff;
}
.page-sound-logo #header .logo img {
	display: block;
	width: 100%;
	margin: 0 auto;
}
.page-sound-logo #header .main_image {
	width: 100%;
	max-width: 1200px;
	text-align: center;
	margin: 0 auto;
}
.page-sound-logo #header .main_image img {
	display: block;
	width: 100%;
	margin: 0 auto;
}

/******************************************************************

固定ページ

******************************************************************/
/*
サウンドロゴページ セクション共通
*/
.page-sound-logo .sound-logo {
	margin-bottom: 5.4rem;
	background-color: #63af35;
}
.page-sound-logo .sound-logo .bg-round {
    margin-right: 9%;
    padding: 6.5rem 2% 6.5rem 9%;
    background-color: #ffffff;
    border-radius: 0 82px 82px 0;
    box-shadow: 10px 10px 0 10px #3c7238;
}
.page-sound-logo .sound-logo .bg-round.bg-round-reverse {
	/* 右端へ伸ばす反転背景 */
	margin-right: 0;
	margin-left: 9%;
	padding: 6.5rem 9% 6.5rem 2%;
	border-radius: 82px 0 0 82px;
	box-shadow: -10px 10px 0 10px #3c7238;
}
.page-sound-logo .sound-logo .base_width {
	width: 100% !important;
	max-width: 1030px;
	margin: 0 auto !important;
}
.page-sound-logo .sound-logo .section_header {
	text-align: center;
}
.page-sound-logo .sound-logo .section_title {
    font-size: 4.5rem;
    line-height: 1.4;
    color: #ff0000;
	margin-bottom: 1.8rem;
}
.page-sound-logo .sound-logo .section_inner_title {
	font-size: 2.7rem;
    line-height: 1.4;
	color: #63af35;
	text-align: center;
}
.page-sound-logo .sound-logo-divider {
	width: 100%;
	margin: 1.8rem auto 2.7rem;
	border-top: 5px solid #63af35;
}
.page-sound-logo .sound-logo-text {
	font-size: 1.7rem;
	color: #63af35;
}
/* 「投票する」ボタン */
.page-sound-logo .btn-vote-wrapper {
	text-align: center;
}
.page-sound-logo .btn-vote {
	display: inline-block;
	background-color: #ff0000;
	color: #ffffff;
	border-radius: 50px;
	padding: 1.0rem 0.5rem;
	max-width: 500px;
	width: 100%;
	font-size: 2rem;
	cursor: pointer;
}
.page-sound-logo .btn-vote:hover {
	background-color: #ff7070;
	opacity: 1;
}

.page-sound-logo #sound-logo-selection .section_main,
.page-sound-logo #sound-logo-summary .section_main {
	margin-bottom: 5.5rem;
}


/*
あなたの1票が高知の旬を盛り上げる！
*/
.page-sound-logo #sound-logo-lead .sound-logo-period {
    font-size: 2.2rem;
    line-height: 1.4;
    color: #ff0000;
	margin-bottom: 4.5rem;
}
.page-sound-logo #sound-logo-lead .sound-logo-period-separator {
	display: inline-block;
}


/*
今すぐサウンドロゴをチェックする
*/
.page-sound-logo #sound-logo-selection .selection-list {
}
.page-sound-logo #sound-logo-selection .selection-list > li {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 1.0rem;
	margin-bottom: 1.0rem;
    padding-bottom: 1.0rem;
	border-bottom: 1px solid #dddddd;
}
.page-sound-logo #sound-logo-selection .selection-list > li .audio {
	flex-basis: 35%;
	max-width: 330px;
}
.page-sound-logo #sound-logo-selection .selection-list > li .text {
	flex: 1;
}
.page-sound-logo #sound-logo-selection .selection-list > li .audio audio {
	width: 100%;
}
.page-sound-logo #sound-logo-selection .selection-list > li .list-title {
	font-size: 1.2rem !important;
	color: #231815;
}


/*
キャンペーン概要
*/
.page-sound-logo #sound-logo-summary .section_inner_title {
	font-size: 2.0rem;
	text-align: left;
	margin-bottom: 0.9rem;
	text-indent: -1.2rem;
}
.page-sound-logo #sound-logo-summary .section_inner {
	font-size: 1.1rem;
	padding-bottom: 2.5rem;
    margin-bottom: 2.5rem;
    border-bottom: 1px solid #63af35;
}
.page-sound-logo #sound-logo-summary .section_inner .text {
	text-indent: -1.1rem;
	padding-left: 1.1rem;
}
.page-sound-logo #sound-logo-summary .section_inner .text .no-indent {
	text-indent: 0;
	padding-left: 0;
}

/* キャンペーン商品 */
.page-sound-logo #sound-logo-summary .section_inner.campaign-gift-wrapper .text {
	margin-bottom: 1.5rem;
}
.page-sound-logo #sound-logo-summary .section_inner .campaign-gift {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 1.5rem 4%;
	margin-bottom: 1.0rem;
}
.page-sound-logo #sound-logo-summary .section_inner .campaign-gift-thumb {
	flex-basis: 55%;
	max-width: 55%;
}
.page-sound-logo #sound-logo-summary .section_inner .campaign-gift-text {
	flex-basis: 41%;
	max-width: 41%;
	font-size: 1.0rem;
	color: #231815;
}
.page-sound-logo #sound-logo-summary .section_inner .campaign-gift-text .campaign-gift-head {
	font-size: 2.0rem;
	color: #63af35;
}
.page-sound-logo #sound-logo-summary .section_inner .campaign-gift-text .campaign-gift-title {
	font-size: 3.5rem;
	font-weight: bold;
	line-height: 1.4;
}
.page-sound-logo #sound-logo-summary .section_inner .campaign-gift-text .campaign-gift-sub {
	font-size: 1.5rem;
	font-weight: bold;
	margin-bottom: 0.5rem;
}

/* 注意事項 */
.page-sound-logo #sound-logo-summary .section_inner.attention-wrapper .section_inner_title {
	font-size: 1.2rem;
	text-indent: -0.5rem;
}
.font-color-red {
	color: #d93b15;
}



/******************************************************************

フッター

******************************************************************/
.page-sound-logo #footer {
	background-color: #63af35;
	color: #ffffff;
	text-align: center;
}
.page-sound-logo #footer a {
	color: #ffffff;
}
.page-sound-logo #inner-footer {
	padding: 2.0rem 1.5rem 2.0rem;
}
.page-sound-logo #footer-main {
	display: flex;
	justify-content: center;
}
.page-sound-logo .sound-logo-contact {
    font-size: 1.3rem;
    margin-bottom: 1.8rem;
    text-align: left;
    max-width: 630px;
    margin: 0 auto 1.8rem;
}
.page-sound-logo .sound-logo-contact > p {
	display: flex;
	flex-wrap: wrap;
	gap: 0 1.8rem;
	margin-bottom: 0.9rem;
}
.page-sound-logo #footer-bottom {
	font-size: 0.9rem;
}


/******************************************************************
*******************************************************************

メディアクエリー

*******************************************************************
******************************************************************/
/* ~ 1280px : PC screens */
@media only screen and (max-width: 80em) {
	.page-sound-logo .sound-logo .bg-round {
		margin-right: 5%;
		padding: 6.5rem 2% 6.5rem 5%;
	}
	.page-sound-logo .sound-logo .bg-round.bg-round-reverse {
		margin-right: 0;
		margin-left: 5%;
		padding: 6.5rem 5% 6.5rem 2%;
	}
}

/* ~ 1024px : Medium screens */
@media only screen and (max-width: 64em) {
	html {
		font-size: 0.9375rem;
	}

    .page-sound-logo .sound-logo .bg-round {
        padding: 5.0rem 2% 5.0rem 5%;
    }

	.page-sound-logo .sound-logo .section_inner_title {
		font-size: 2.2rem;
	}
	.page-sound-logo .sound-logo-text {
		font-size: 1.5rem;
	}
	.page-sound-logo #sound-logo-summary .section_inner_title {
		font-size: 1.6rem;
		text-indent: -1.0rem;
	}


	.page-sound-logo #sound-logo-summary .section_inner .campaign-gift-text {
		font-size: 0.9rem;
	}
	.page-sound-logo #sound-logo-summary .section_inner .campaign-gift-text .campaign-gift-head {
		font-size: 1.6rem;
	}
	.page-sound-logo #sound-logo-summary .section_inner .campaign-gift-text .campaign-gift-title {
		font-size: 2.8rem;
	}
	.page-sound-logo #sound-logo-summary .section_inner .campaign-gift-text .campaign-gift-sub {
		font-size: 1.2rem;
	}

}

/* ~ 896px : スマホ横 */
@media only screen and (max-width: 56em) {
}

/* ~ 812px : iphone X screens */
@media only screen and (max-width: 50.750em) {
	html {
		font-size: 0.875rem;
	}

	.page-sound-logo .sound-logo .bg-round {
		margin-right: 3%;
		padding: 5.4rem 2% 5.4rem 3%;
		border-radius: 0 50px 50px 0;
		box-shadow: 5px 5px 0 5px #3c7238;
	}
	.page-sound-logo .sound-logo .bg-round.bg-round-reverse {
		margin-right: 0;
		margin-left: 3%;
		padding: 5.4rem 3% 5.4rem 2%;
		border-radius: 50px 0 0 50px;
		box-shadow: -5px 5px 0 5px #3c7238;
	}
	.page-sound-logo .sound-logo-divider {
		margin: 1.3rem auto 2.2rem;
		border-top: 3px solid #63af35;
	}

}

/* ~ 767px : Tablet screens */
@media only screen and (max-width: 47.938em) {

	.page-sound-logo #sound-logo-summary .section_inner .campaign-gift-thumb {
		flex-basis: 100%;
		max-width: 400px;
	}
	.page-sound-logo #sound-logo-summary .section_inner .campaign-gift-text {
		flex-basis: 100%;
		max-width: 100%;
	}

	.page-sound-logo #sound-logo-selection .selection-list > li {
		margin-bottom: 1.5rem;
	    padding-bottom: 1.5rem;
	}
	.page-sound-logo #sound-logo-selection .selection-list > li .audio {
		flex-basis: 100%;
	}
	.page-sound-logo #sound-logo-selection .selection-list > li .text {
		flex-basis: 100%;
		max-width: 100%;
	}

}

/* 640px以下:Small screens */
@media only screen and (max-width: 40em) {

	.page-sound-logo #header .logo-wrapper {
		left: 3%;
		width: 100%;
		max-width: 120px;
	}
	.page-sound-logo #header:before,
	.page-sound-logo #header:after {
		height: 100px;
		background-size: cover;
	}

    .page-sound-logo .sound-logo .bg-round,
    .page-sound-logo .sound-logo .bg-round.bg-round-reverse {
        margin: 0 1%;
        padding: 3.5rem 2% 3.5rem 2%;
        border-radius: 35px 35px;
        box-shadow: none;
    }
	.page-sound-logo #sound-logo-selection .section_main,
	.page-sound-logo #sound-logo-summary .section_main {
		margin-bottom: 3.5rem;
	}

	.page-sound-logo .sound-logo .section_title {
		font-size: 2.0rem;
	}
	.page-sound-logo .sound-logo .sound-logo-period {
		font-size: 1.5rem;
	}
	.page-sound-logo .sound-logo .section_inner_title {
		font-size: 1.6rem;
	}
	.page-sound-logo .sound-logo-text {
		font-size: 1.2rem;
	}
	.page-sound-logo #sound-logo-summary .section_inner_title {
        font-size: 1.4rem;
        text-indent: -0.8rem;
    }
	.page-sound-logo #sound-logo-summary .section_inner .text {
		text-indent: -1.0rem;
		padding-left: 1.0rem;
	}

	.page-sound-logo .btn-vote {
		font-size: 1.8rem;
	}

	.page-sound-logo .sound-logo-contact .organization-name {
		display: block;
		margin: 0;
	}
	.page-sound-logo .sound-logo-contact {
		font-size: 1.0rem;
	}

}

/* 479px以下: SP screens */
@media only screen and (max-width: 29.938em) {

	.page-sound-logo .sound-logo {
		margin-bottom: 4rem;
	}
	.page-sound-logo .sound-logo .section_title {
		font-size: 2.0rem;
	}
	.page-sound-logo .sound-logo .sound-logo-period {
		font-size: 1.5rem;
	}
	.page-sound-logo .sound-logo .section_inner_title {
		/* font-size: 1.4rem; */
	}
	.page-sound-logo .sound-logo-text {
		/* font-size: 1.1rem; */
	}
	.page-sound-logo #sound-logo-summary .section_inner_title {
        font-size: 1.4rem;
        text-indent: -0.8rem;
    }
	.page-sound-logo #sound-logo-summary .section_inner .text {
		text-indent: -1.0rem;
		padding-left: 1.0rem;
	}

	.page-sound-logo #sound-logo-summary .section_inner .campaign-gift-text {
		font-size: 1.0rem;
	}
	.page-sound-logo #sound-logo-summary .section_inner .campaign-gift-text .campaign-gift-head {
		font-size: 1.4rem;
	}
	.page-sound-logo #sound-logo-summary .section_inner .campaign-gift-text .campaign-gift-title {
		font-size: 2.4rem;
	}
	.page-sound-logo #sound-logo-summary .section_inner .campaign-gift-text .campaign-gift-sub {
		font-size: 1.1rem;
	}


	.page-sound-logo #sound-logo-selection .selection-list > li .list-title {
		font-size: 1.1rem !important;
	}

}