@charset "utf-8";
/* リセットCSS */
* {
	margin:0;
	padding:0;
}

body {
    margin: 0px;
	font-family: "Open Sans","Helvetica Neue","游ゴシック Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN",メイリオ,Meiryo,sans-serif;
    color: #333;
    background-color: #fff;
}

ul {
	list-style: none;
}

a:link {
	text-decoration: none;
}

button{
	background-color: transparent;
	border: none;
	cursor: pointer;
	outline: none;
	padding: 0;
	appearance: none;
}

/* 設定 */
.pc {
	padding: 0 10px;
}

/* header */
header {
	position: fixed;
	width: 100%;
	padding-top: 20px;
	background-color:#fff;
	z-index: 5;

}

.header-title-box {
	position: relative;
}

.header-logo-flame {
	position: absolute;
	margin-left: 20px;
}

.header-sns-flame {
	position: absolute;
	right: 40px;
}

.header-sns-flame a img:hover {
	opacity: 0.7;
}

#twitter {
	margin-right: 20px;
}

.header-select-box {
	display: flex;
	padding: 10px;
	justify-content: center;
}

.select-page {
	margin: 0 20px;
}

.select-page:hover {
	opacity: 0.7;
}

#green-hover {
	padding-bottom: 5px;
    border-bottom: solid 2px #00693e;
}

.select-page a {
	color: #333333;
	font-size: 16px;
	font-weight: bold;
}

/*

traffic

*/

.rank-content {
	width: 680px;
	margin: 20px 0;
}

.genre-top-text {
	font-size: 16px;
	text-align: left;
}

/* タブ切り替え */
.tab-box {
	display: flex;
}

.ChangeElem_Btn {
	width: 235px;
	height: 85px;
	margin: 10px;
}

.traffic-tab {
	width: 235px;
	height: 60px;
	border: 1px solid #777;
	border-radius: 10px;
	font-size: 20px;
	color: #777777;
}

.traffic-tab:hover {
	opacity: 0.5;
}

.tab {
	display: flex;
	width: 100%;
	margin: 80px auto 100px;
    justify-content: center;
}

.tab-traffic {
	width: 1025px;
	flex-wrap: wrap;
}

.top {
	margin: 75px auto;
}

.current {
	background-image: url(../img/button-traffic.png);
	border: 1px solid #ffffff;
}

.current-w {
	color: #ffffff;
	border: 0;
}

.current-btm {
	z-index: 3;
	background-color: #00603b;
	border: 1px solid #00603b;
	border-radius: 10px;
	color: #ffffff;
}

.genre-department-text {
	margin: 40px 0 20px;
	font-size: 30px;
	color: #00603b;
}

/* ランキング */
.genre-img-1-flame {
	width: 840px;
	height: 590px;
	display: inline-block;
	overflow: hidden;
	position: relative;
}

.genre-img-1 {
	position: absolute;
	width: 100%;
	height: 100%;
	margin: auto 0;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.genre-rank-1 {
	display: flex;
}

.genre-icon-box {
	display: flex;
	position: relative;
	width: 545px;
    font-size: 75%;
	margin: auto;
	z-index: 1;
}

.genre-this-year {
	position: relative;
	margin-right: 20px;
	display: inline-block;
}

.genre-this-num-text {
	position: absolute;
	top: 18px;
	right: 55px;
	color: #ffffff;
	font-size: 38px;
}

.genre-rank-1-box {
	text-align: left;
	margin-top: 30px;
}

.genre-rank-1-name {
	font-size: 30px;
	font-weight: bold;
	color: #00603b;
}

.genre-rank-1-name:hover {
	opacity: 0.7;
}

.genre-rank-1-address {
	font-size: 16px;
	color: #777777;

}

.genre-rank-1-coment {
	width: 545px;
	margin: 10px auto 70px;
	font-size: 14px;
	font-weight: 500;
	text-align: left;
}

.genre-2-3-frame {
	display: flex;
	position: relative;
	justify-content: center;
}

.only-2-frame {
	margin: 80px 0;
}

.genre-img-2-3-flame {
	width: 450px;
	height: 300px;
	display: inline-block;
	overflow: hidden;
	position: relative;
}

.genre-img-2-3 {
	position: absolute;
	width: 100%;
	height: 100%;
	margin: auto 0;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.genre-detail-2-3-box {
	width: 400px;
	margin-left: 30px;
	word-wrap: break-word;
}

.genre-icon-2-3-box {
	margin-top: -20px;
	text-align: left;
}

.genre-rank-2-3-box {
	text-align: left;
	margin-left: 10px;
}

.genre-spot-name-2-3 {
	font-size: 30px;
	font-weight: bold;
	color: #00693e;
}

.genre-spot-name-2-3:hover {
	opacity: 0.7;
}

.genre-address-2-3 {
	font-size: 16px;
	color: #777777;
}

.genre-coment-2-3 {
	margin: 20px 0 0;
	font-size: 15px;
	color: #333333;
	line-height: 20px;
}

.genre-4-20-frame {
	margin: 80px 0 0;
}

.genre-4-20-box {
	display: flex;
	margin-top: 30px;
	justify-content: center;
}

.genre-4-20-title {
	font-size: 30px;
	color: #333333
}

.genre-4-20-singly {
	display: flex;
    height: 70px;
    margin-bottom: 50px;
}

.genre-this-num-text-other {
	position: absolute;
    top: 7px;
    right: 8px;
    color: #fefefe;
    font-size: 14px;
    font-weight: bold;
}

.digit {
	right: 12px;
}

.genre-4-20-detail-box {
	width: 300px;
    height: 40px;
    line-height: 18px;
    text-align: left;
}

.genre-4-20-detail-box a {
	color: #333333;
	font-size: 22px;
	font-weight: bold;
	line-height: 30px;
}

.genre-4-20-detail-box a:hover {
	opacity: 0.7;
}

.genre-4-20-address {
	margin-top: 10px;
	font-size: 14px;
	color: #777777;
}

#other-left {
	margin-right: 60px;
}

#other-right {
	margin-left: 60px;
}


/* pick up */
.pick-up-box {
	max-width: 1180px;
	height: 450px;
	margin: 15px 0;
	border: 1px solid #a58432;
	border-radius: 10px;
}

.pick-up-in-box {
	display: flex;
	padding: 50px;
}

.pick-up-img-box {
	width: 500px;
	height: 350px;
	display: inline-block;
    overflow: hidden;
    position: relative;
}

.pick-up-img-box img {
	position: absolute;
    width: 100%;
    height: 100%;
    margin: auto 0;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.pick-up-detail-box {
	padding: 30px 30px 30px 60px;
}

.pick-up-title-box {
	display: flex;
}

.pick-up-white-box {
	position: relative;
}

.this-pick-up-text {
	position: absolute;
    top: 28px;
    right: 33px;
	font-size: 18px;
	font-weight: bold;
}

.pick-up-text-box {
	margin: 30px 0 0 30px;
	text-align: left;
}

.pick-up-title-text {
	font-size: 30px;
	font-weight: bold;
	color: #a58432;
}

.pick-up-title-text:hover {
	opacity: 0.7;
}

.pick-up-detail-text {
	font-size: 16px;
	color: #777777;
}

.per-pick-up {
	margin: 25px 0 0 auto
}

.pick-up-coment {
	width: 500px;
	font-size: 14px;
	color: #333333;
	text-align: left;
}

.jtb-text {
	color: #777777;
	font-size: 11px;
	text-align: left;
}

/*

index

*/

.index-img {
	width: 100%;
	margin-top: 90px;
}

#img-1-20 {
	margin-top: 60px;
}

.rank-content-text-index {
	text-align: center;
	font-size: 16px;
}

.index-1-3-border-frame {
	display: flex;
	margin-bottom: 80px;
}

.index-1-3-width {
	width: 500px;
}

.index-japanese-img {
	text-align: center;
}

.index-japanese-img {
	margin-bottom: 30px;
}

.index-foreigner-img {
	margin: 16px 0 30px;
}

.index-img-1-3-frame {
    height: 350px;
}

.index-img-1-3 {
    width: 100%;
    height: 100%;
    margin: auto 0;
}

.index-1-3-detail-frame {
	display: flex;
	margin: 0 30px;
	justify-content: space-between;
}

.index-1-3-detail-box {
	padding: 30px;
}

.index-1-3-ornament {
	margin-top: 30px;
}

.jp-fg-ornament-img {
	width: 34px;
	height: auto;
}

.index-1-3-spot-name {
	margin: auto;
	color: #a58432;
	font-size: 30px;
	font-weight: bold;
}

.index-1-3-detail-box a :hover {
	opacity: 0.7;
}

.index-1-3-spot-address {
	color: #777777;
	font-size: 16px;
}

.index-1-3-coment-text {
	font-size: 14px;
	text-align: left;
}

.index-rank-1-img {
	margin: 220px auto;
}

.index-rank-2-3-img {
	margin: 120px auto;
}

.index-4-10-title {
	margin: 80px 0 50px;
}



.index-4-10 {
	display: flex;
	margin-bottom: 60px;
}

.index-4-10-frame {
	width: 500px;
	display: flex;
}

.index-4-10-detail-frame {
	margin: auto 0;
}

.index-last-year-frame {
	position: absolute;
	margin-top: 10px;
}

.index-last-year-frame p {
	color: #777777;
	font-size: 10px;
}

.index-4-10-spot-name {
	width: 210px;
	font-size: 22px;
	text-align: center;
}

.index-4-10-spot-name a {
	color: #333333;
	text-align: center;
	font-weight: bold;
}

.index-4-10-spot-name a:hover {
	opacity: 0.7;
}

.index-4-10-spot-address {
	color: #777777;
	font-size: 14px;
}

.index-4-10-detail-box {
	margin-top: 20px;
}

.index-4-10-img-box {
	width: 250px;
	height: 170px;
    display: inline-block;
    overflow: hidden;
	position: relative;
}

.index-4-10-left-side {
	margin-left: auto;
}

.index-4-10-right-side {
	margin-right: auto;
}

.index-4-10-spot-img {
	position: absolute;
    width: 100%;
    height: 100%;
    margin: auto 0;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.index-rank-4-10-img {
	margin: auto;
}

.index-11-20-title {
	margin: 80px 0 40px;
}

.rank-index-other {
	width: 400px;
}

#rank-index-other-center {
	padding: 0;
}

.index-other-spot-name {
	height: 40px;
    font-size: 20px;
    line-height: 18px;
    text-align: left;
}

.index-other-spot-name a {
	margin-bottom: 10px;
	font-weight: bold;
	color: #333;
}

.index-other-spot-name a:hover {
	opacity: 0.7;
}

.index-21-100-text {
	font-size: 30px;
	margin: 70px 0 40px;
}

.to-all-img-box a img:hover {
	opacity: 0.7;
}

.total-coments {
	width: 680px;
	margin: 65px auto 0;
	font-size: 16px;
	text-align: left;
}

.note-text {
	margin: 60px 0 80px;
	color: #777777;
	font-size: 14px;
}



/*

all

*/
#width {
	max-width: 1180px;
    margin: 0 auto;
    text-align: center;
    padding-bottom: 40px;
}

#img-21-100 {
	margin-top: 120px;
	padding: 20px;
}

#rank-content {
	width: 680px;
	margin: 40px auto 40px;
}

.rank-content-text {
	font-size: 16px;
	text-align: left;
}

#img-japanese {
	padding: 20px;
}

.rank-title-number {
	margin: 10px 0 50px 85px;
	padding-left: 18px;
	font-size: 30px;
	text-align: left;
	font-weight: bold;
}

.lft,.cft,.rft {
	width: 280px;
	padding: 0 10px;
	float: left;
}

.mid-bot-title-number {
	margin: 80px 0 50px 85px;
}

.rank-all {
	display: flex;
	height: 70px;
	margin-bottom: 20px;
}

.icon-box {
	display: flex;
	position: relative;
	margin-right: 30px;
	z-index: 1;
}

.rank-this-year {
	margin-right: 10px;
	display: inline-block;
	position: relative;
}

.rank-this-num-text {
    position: absolute;
    top: 7px;
    right: 8px;
    color: #fefefe;
	font-size: 14px;
	font-weight: bold;
}

#three-digit-number {
	right: 4px;
}

.rank-last-year {
	display: inline-block;
    text-align: center;
    vertical-align: middle;
    margin-left: 6px;
}

.rank-last-num-text {
	font-size: 11px;
}

.spot-name {
    width: 240px;
    height: 40px;
    font-size: 120%;
    line-height: 18px;
	text-align: left;
}

.spot-name a {
	margin-bottom: 10px;
	font-weight: bold;
	color: #333;
}

.spot-name a:visited {
	color:#333;
}

.address {
	margin-top: 10px;
    font-size: 14px;
    color: #737373;
}


/* 元スタイル適応 */
.lft, .ctr, .rit {
    width: 280px;
    padding: 0 10px;
    float: left;
}

.rank-list {
	width: 1000px;
    margin: auto;
}

#other-center {
	margin: 0 50px;
}


/*
footer前
*/
.banner-box {
	display: flex;
	margin: 40px 0;
	justify-content: center;
}

.banner-box a {
	height: 155px;
}

.banner-box a img {
	width: 100%;
	height: 100%;
}

.banner-box :hover {
	opacity: 0.7;
}

#center-banner {
	margin: 0 20px;
}

.sns-box {
	margin: 20px 0 50px;
	text-align: center;
}

.sns-box a :hover {
	opacity: 0.7;
}

.share-text {
	margin-bottom: 10px;
	font-size: 30px;
	font-weight: bold;
}

.pagetop {
	width: fit-content;
	margin: auto;
	text-align: center;
}

.pagetop a :hover {
	opacity: 0.7;
}

.footer-text-box {
	text-align: center;
}

.footer-text {
	margin-top: 30px;
	color: #777777;
	font-size: 10px;
	text-align: left;
}

/* footer */
footer {
	margin: 45px 0 0;
	width:100%;
	height:auto;
	background:#333333;
	padding:40px 0;
}

footer ul {
	width:1000px;
	margin:0 auto;
	height:auto;
	text-decoration:none;
	list-style:none;
	font-size:16px;
}

.clf {
    zoom: 100%;
}

footer ul li {
	float:left;
	padding:0 5px;
}

footer ul li a {
	color:#fff;
}

footer ul li a:hover {
	color:#fff;
}

.vertical {
	color:#fff;
}

.clf:after {
    content: ".";
    display: block;
    visibility: hidden;
    height: 0.1px;
    font-size: 0.1em;
    line-height: 0;
    clear: both;
}

footer p {
	width: 100%;
	text-align: center;
	color: #fff;
	font-size: 12px;
	margin-top: 40px;
}

.sp {
	display: none;
}

.sp-footer {
	display: none;
}


/*
sp用
*/
@media screen and (max-width: 1280px) {
	/* 設定系 */

	a:link {
		color: #333;
		text-decoration: none;
	}
	a:visited {
		color: #333;
		text-decoration: none;
	}
    .fixing {
        width: 100%;
    }
    .check-frame {
        width: 100%;
    }
    .tdl-image {
        width: 100%;
    }
    p {
        font-size: 13px;
    }


    /* pc版消す系 */
    .pc {
        display: none;
    }
    .pc-footer {
        display: none;
    }

    /* sp写す */
    .sp {
		display: block;
		/* padding: 0 10px 10px; */

	}

	.sp-footer {
		display: block;
		margin: 0;
	}

	* {
		margin:0;padding:0;
	}

	/*
	header(重複有り)
	*/
	header {
		position: fixed;
		width: 100%;
		padding-top: 20px;
		background-color: #fff;
		z-index: 5;
	}

	.sp-rank-content{
		width: 100%;
		height: auto;
		margin: 0 auto;
		text-align:left;
		padding-bottom: 40px;
		background: #ffffff;
	}

	.sp-title-box {
		position: relative;
	}

	.sp-title-text {
		position: absolute;
		width: 100%;
		background-color: #ffffff;
		padding-bottom: 20px;
		text-align: center;
	}

	h1 {
		font-size: 14px;
	}

	.margin-box {
		text-align: center;
	}

	#sp-img-21-100 {
		width: 70%;
		height: auto;
		margin-top: 70px;
		padding: 20px;
	}

	.sp-rank-content-text {
		margin: 10px 30px;
		text-align: left;
		line-height: 2;
	}

	.sp-rank-content-text p {
		word-break: break-all;
	}

	#img-japanese {
		width: 240px;
		height: auto;
	}

	.sp-rank-title-number {
		margin: 20px 0 40px;
		text-align: center;
		font-size: 24px;
		font-weight: bold;
	}

	.mid-bot-title-number {
		margin: 40px 0;
	}

	.sp-lft, .sp-cft, .sp-rft {
		min-width: 240px;
		padding: 0 30px;
		margin: auto;
	}

	.rank-all {
		justify-content: center;
	}

	.rank-last-year img {
		width: auto;
		height: 11px;
	}

	.sp-clf {
		margin-top: 40px;
		padding: 0 20px;
		color: #777777;
		font-size: 12px;
		text-align: left;
	}

	.sp-clf li {
		margin: 5px 0;
	}

	/* footer */
	.footer-text p {
		word-break: break-all;
	}

	/* ハンバーガーメニュー */
    nav.globalMenuSp {
		position: fixed;
		width: 100%;
        z-index: 2;
        top: 0;
        left: 0;
        text-align: center;
        transform: translateY(-100%);
        background-color: rgba(52, 52, 52, 0.9);
        box-shadow: 0 0.1rem 0.1rem 0 rgba(0,0,0,0.2);
    }

    nav.globalMenuSp ul {
        margin: 100px auto 30px;
        padding: 0;
        width: 100%;
    }

    nav.globalMenuSp ul li {
        font-size: 1.1em;
        list-style-type: none;
        margin: 0 20px;
        padding: 0;
        border-bottom: 1px solid #ffffff;
	}

	nav.globalMenuSp ul li:first-child {
		margin-top: 10px;
        border-top: 1px solid #ffffff;
    }

    nav.globalMenuSp ul li:last-child {
        padding-bottom: 0;
    }

    nav.globalMenuSp ul li a {
		display: block;
		padding: 20px 0;
		color: #ffffff;
		font-size: 17px;
    }

    /* このクラスを、jQueryで付与・削除する */
    nav.globalMenuSp.active {
		transform: translateY(0%);
		height: 100vh;
    }

    .navToggle {
		position: absolute;
        width: 19px;
        height: 17px;
        margin-left: 20px;
        background: url(../img/sp-icon-menu-open.png);
    }

    .img-i {
        margin-left: 20px;
        background: url(../img/sp-icon-menu-close.png);
    }

    .sns-box-menu {
        margin: 50px 30px 20px;
        padding: 10px 15px;
        background-color: #ffffff;
	}

	.share-text {
		font-size: 18px;
	}

	/* index */
	.changeelem-btn {
		width: 100%;
	}

	.sp-foreigner-white-img {
		height: 100px;
		background: url(../img/sp-tab-top-foreigner-dark.png) no-repeat center;
		background-size: 50vw;
	}

	.sp-japanese-white-img {
		height: 100px;
		background: url(../img/sp-tab-top-japan-dark.png) no-repeat center;
		background-size: 50vw;
	}

	.sp-jp-fg-top0 {
		height: 100px;
		background: url(../img/sp-tab-top-japan.png) no-repeat center;
		background-size: 50vw;
	}

	.sp-jp-fg-top1 {
		height: 100px;
		background: url(../img/sp-tab-top-foreigner.png) no-repeat center;
		background-size: 50vw;
	}

	.sp-btm-fg-btm0 {
		height: 100px;
		background: url(../img/sp-tab-under-japan.png) no-repeat center;
		background-size: 50vw;
	}

	.sp-btm-fg-btm1 {
		height: 100px;
		background: url(../img/sp-tab-under-foreigner.png) no-repeat center;
		background-size: 50vw;
	}

	.sp-index-1-3-king-box img {
		width: 25%;
	}

	.sp-index-spot-img-box {
		width: 85%;
		height: 195px;
		margin: auto;
	}

	.sp-index-spot-img {
		width: 100%;
		height: 100%;
	}

	.sp-index-1-3-detail-frame {
		display: flex;
		margin: 0 30px 0 30px;
    	justify-content: space-between;
	}

	.sp-index-1-3-spot-name {
		margin: auto;
		color: #a58432;
		font-size: 20px;
		font-weight: bold;
	}

	.sp-index-1-3-spot-address {
		margin-top: 5px;
		color: #737373;
		font-size: 10px;
	}

	.sp-index-1-3-coment-text {
		margin: 0 40px 30px;
		font-size: 13px;
		line-height: 2;
		text-align: left;
	}

	.sp-index-rank-4-10-frame {
		display: flex;
		margin: 40px 0 50px;
	}

	.sp-index-rank-4-10-box {
		width: 50%;
		padding: 5px;
		text-align: left;
	}

	.sp-index-rank-4-10-left {
		padding-left: 20px;
	}

	.sp-index-rank-4-10-right {
		padding-right: 20px;
	}

	.sp-index-4-10-this-last-box {
		display: flex;
	}

	.sp-index-rank-text-box {
		display: inline-block;
		position: relative;
	}

	.all-img-other {
		width: 24px;
		height: auto;
	}

	.sp-index-rank-4-10-text {
		position: absolute;
		top: 4px;
		right: 8px;
		font-size: 14px;
		color: #fefefe;
		font-weight: bold;
	}

	.index-digit {
		top: 4px;
		right: 5px;
	}

	.sp-index-4-10-triangle-box {
		margin-left: 10px;
	}

	.sp-index-4-10-triangle-box img {
		width: 8px;
		height: 6;
		margin-left: 1px;
	}

	.sp-index-4-10-triangle-box p {
		font-size: 10px;
	}

	.sp-index-4-10-img {
		width: 100%;
		height: 134px;
	}

	.sp-index-4-10-spot-name {
		font-size: 17px;
		font-weight: bold;
	}

	.sp-index-4-10-spot-address {
		margin-top: 5px;
		color: #777777;
		font-size: 10px;
	}

	.sp-index-rank-4-10-last-box {
		width: 50%;
    	padding-right: 20px;
		margin-top: 70px;
	}

	.sp-index-rank-4-10-last-box img {
		width: 80%;
	}

	.sp-index-11-20-triangle-box {
		margin-left: 10px;
		display: inline-table;
	}

	.sp-index-11-20-triangle-box img {
		width: 8px;
		height: auto;
	}

	.sp-foreigner-1-digit {
		margin-left: 14px;
	}

	/* index-tab */
	.index-tab {
		display: flex;
	}

	.sp-index-top {
		margin: 40px 0 20px;
	}

	.sp-index-btm {
		margin: 40px 0;
	}

	/* index-dooter前 */
	.index-total-coment-box {
		margin: 0 40px;
		text-align: left;
		line-height: 2;
	}

	.sp-index-to-all-text {
		font-size: 15px;
		font-weight: bold;
	}

	.sp-to-21-100-img-box {
		margin: 10px 0;
	}

	.sp-to-21-100-img {
		width: 50%;
		height: 40px;
	}

	.sp-index-note-text {
		font-size: 10px;
		color: #777777;
	}

	/* traffic */

	.sp-staffic-rank-frame {
		margin-top: 200px;
	}

	.sp-genre-top-coment {
		width: 70%;
		margin: 10px auto;
		padding: 10px;
		text-align: left;
	}

	.sp-tab {
		width: 290px;
		height: 40px;
		margin: auto;
		flex-wrap: wrap;
	}

	.sp-traffic-tab {
		width: 135px;
		height: 50px;
		margin: 5px;
		color: #777777;
		font-size: 15px;
		border: 1px solid #777777;
		border-radius: 5px;
	}

	.sp-line-text {
		font-size: 15px;
	}

	.sp-current-color {
		color: #ffffff;
		background-color: #00693e;
		border: 0;
	}

	.sp-content {
		padding: 10px;
		text-align: center;
	}

	#sp-tab_cont {
		margin-top: 100px;
	}

	h2 {
		font-size: 20px;
		color: #00693e;
		margin-bottom: 20px;
	}

	/* 1-3 */
	.rank-icon-1-3-box {
		position: relative;
	}

	.rank-1-3-text {
		position: absolute;
		top: 20px;
		left: 48px;
		font-size: 38px;
		color: #ffffff;
	}

	.sp-img-1-3-box {
		width: 85%;
		height: 195px;
		margin: auto;
	}

	.sp-img-1-3-box img {
		width: 100%;
		height: 100%;
		margin: auto 0;
	}

	.sp-top-spot-frame {
		margin-top: 20px;
	}

	.spot-name-genre-text {
		font-size: 20px;
		font-weight: bold;
	}

	.traffic-color {
		color: #00693e !important;
	}

	.spot-name-genre-text-other {
		font-size: 15px;
		font-weight: bold;
	}

	.top-address-traffic-text {
		font-size: 10px;
		color: #777777;
		font-weight: 500;
	}

	/* 4-20 */
	.sp-genre-4-20-frame {
		margin-bottom: 10px;
	}

	.rank-4-20 {
		margin-right: 10px;
	}

	.genre-4-20-num {
		top: 8px;
		right: 12px;
	}

	.digit {
		right: 9px;
	}

	.spot-name {
		font-size: 18px;
	}

	.rank-4-20-box {
		width: 200px;
		text-align: left;
	}

	.spot-name-traffic-text {
		font-size: 14px;
	}

	.spot-address-traffic-text {
		font-size: 10px;
		color: #777777;
	}

	.sp-pick-up-box {
		padding: 10px;
		border: 1px solid #a58432;
		border-radius: 5px;
	}

	.rank-pick-up-text {
		position: absolute;
		top: 30px;
		left: 38px;
		font-size: 12px;
		font-weight: bold;
	}

	.detail-coment-text{
		width: 80%;
		margin: 20px auto;
		font-size: 13px;
		text-align: left;
	}

	.detail-coment-text p {
		margin-top: 10px;
		color: #777777;
		font-size: 13px;
		font-weight: 500px;
	}

	.traffic-color {
		color: #00693e !important;
	}

	.sp-4-20-ul-frame {
		margin: 50px 0 30px;
	}

	/* pick-up */
	.sp-pick-up-spot-frame {
		display: flex;
		margin: 10px 20px 10px;
		word-break: break-all;
		justify-content: center;
	}

	.sp-pick-up-spot-box {
		width: 180px;
		text-align: left;
	}

	.pick-up-detail-coment-text {
		width: 85%;
		margin: auto;
		padding: 10px;
		font-size: 13px;
		text-align: left;
	}

	.pick-up-detail-coment-text p {
		margin-top: 10px;
		color: #777777;
		font-size: 13px;
		font-weight: 500px;
	}

	.top-name-traffic-text {
		font-size: 20px;
		font-weight: bold;
	}

	/* footer前
	 */
	.sp-other-img-box {
		margin: 50px 0;
	}

	.sp-other-img {
		width: 200px;
		height: auto;
		margin: 10px;
	}

	.sp-mid-other-img {
		margin: 10px;
	}

	.footer-text {
		padding: 0 20px;
		line-height: 2;
	}

	/* index */
	.sp-index-frame {
		width: 100%;
	}

	.sp-index-img {
		width: 100%;
		margin-top: 80px;
	}

	.sp-top-ranking-img {
		width: 80%;
		padding: 20px;
	}

	.icon-1-digit {
		margin-right: 33px;
	}

	.sp-index-jtb-text {
		color: #777777;
		font-size: 10px;
		text-align: left;
	}

	/* all */
	.sp-all-1-digit {
		margin-left: 11px;
	}
}