@charset "utf-8";

.wrp-photo-search{
	max-width:1050px;
	margin:0 auto;
	background:#F7F5F0;
	border-radius:5px;
	border:3px solid #A47B51;
}

.wrp-photo-search .photo-search-ttl{
	margin-bottom:30px;
    padding:10px 0 20px 50px;
	background-image:url(../img/top/icn-spot-search.png);
	background-repeat:no-repeat;
	background-size:40px 40px;
	border-bottom:1px dashed #806040;
    font-size:2rem;
    font-family:'07logotypegothic7regular';
    color:#806040;
    line-height:1;
}

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

.wrp-photo-search .photo-search-ttl{
	margin-bottom:15px;
    padding:0 0 0 25px;
	background-size:20px 20px;
	background-position:0 50%;
    font-size:1.5rem;
}

}

.wrp-search{
	max-width:790px;
	margin:0 auto;
	padding:40px 15px;
	text-align:left;
}

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

.wrp-search{
	padding:15px;
}

}

.accordion-box{
	max-width:100%;
}

.spot-cat-list{
	margin-top:50px;
	background:#f7f7f7;
	border:1px solid #ddd;
}

.spot-cat-list ul{
	display:-webkit-box;
	display:-moz-box;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:flex;
	-ms-flex-wrap: wrap;
    flex-wrap: wrap;
	-webkit-box-align:center;
	-ms-flex-align:center;
	align-items:center;
	justify-content:center;
}

.spot-cat-list ul li a{
	display:block;
	padding:10px;
	text-align:center;
}

.spot-cat-list ul li a:hover{
	background-color:#A47B51;
	color:#fff;
}


@media screen and (min-width:1061px) {

.spot-cat-list ul li{
	width:20%;
}

.spot-cat-list ul li:nth-child(n+6){
	width:25%;
	border-top:1px solid #ddd;
}

.spot-cat-list ul li:nth-child(n+2){
	border-left:1px solid #ddd;
}

.spot-cat-list ul li:nth-child(6){
	border-left:none;
}

}

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

.spot-cat-list ul li{
	width:33.33333333%;
}

.spot-cat-list ul li:nth-child(n+2){
	border-left:1px solid #ddd;
}

.spot-cat-list ul li:nth-child(n+4){
	border-top:1px solid #ddd;
}

.spot-cat-list ul li:nth-child(4),
.spot-cat-list ul li:nth-child(7){
	border-left:none;
}

}

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

.spot-cat-list{
	margin-top:25px;
}

.spot-cat-list ul li{
	width:50%;
}

.spot-cat-list ul li a{
	padding:5px;
	font-size:1.2rem;
}

.spot-cat-list ul li:nth-child(even){
	border-left:1px solid #ddd;
}

.spot-cat-list ul li:nth-child(n+3){
	border-top:1px solid #ddd;
}


.spot-cat-list ul li:nth-child(9){
	width:100%;
	border-left:none;
}

}

.spot-cat-box{
	background:#f7f7f7;
	border:1px solid #ddd;
}

@media screen and (min-width:768px) {

.spot-cat-box{
	margin-top:50px;
	padding:25px 25px 5px;
	background:#f7f7f7;
	border:1px solid #ddd;
}

.spot-cat-left{
	float:left;
	width:47.5%;
}

.spot-cat-right{
	float:right;
	width:47.5%;
}

.spot-cat-box h2{
	font-size:3.2rem;
	font-weight:700;
}

.spot-cat-box h3{
	margin-top:15px;
	font-size:1.8rem;
}

.spot-cat-box p{
	margin-top:25px;
}

}

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

.spot-cat-box{
	margin-top:25px;
	padding:15px;
}

.spot-cat-box h2{
	font-size:2rem;
	font-weight:700;
}

.spot-cat-box h3{
	margin-top:5px;
	font-size:1.6rem;
}

.spot-cat-box p{
	margin-top:15px;
}

}



.spot-search-box{
	padding:50px 15px;
	max-width: 1050px;
	background: #F7F5F0;
	margin: 0 auto;
	/*border-radius: 5px;
	border: 3px solid #A47B51;*/
}

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

.spot-search-box{
	padding:15px;
}

}

.spot-research-box{
	padding:50px 15px;
	max-width:1050px;
}


/*.wrp-search{
	max-width:760px;
	margin:0 auto;
	text-align:left;
}*/

.wrp-search input[type="checkbox"]{
	display:none;
}

.wrp-search label{
	position:relative;
	display:inline-block;
	padding:3px 3px 3px 22px;
	cursor:pointer;
	-webkit-transition:all .2s;
	transition:all .2s;
}

.wrp-search label::before,
.wrp-search label::after{
	position:absolute;
	content:"";
	-webkit-transition:all .2s;
	transition:all .2s;
}

.wrp-search label::before{
	top:50%;
	left:0;
	width:14px;
	height:14px;
	margin-top:-8px;
	background:#fff;
	border:1px solid #ccc;
	border-radius:3px;
}

.wrp-search label::after{
	opacity:0;
	top:50%;
	left:3px;
	width:8px;
	height:4px;
	margin-top:-4px;
	border-left:2px solid #6BA516;
	border-bottom:2px solid #6BA516;
	-webkit-transform:rotate(-45deg) scale(.5);
	transform:rotate(-45deg) scale(.5);
}

.wrp-search label:hover::before{
	background:#fff;
}

.wrp-search input[type="checkbox"]:checked + label::before{
	background:#a37e39;
	border:1px solid #a37e39;
}

.wrp-search input[type="checkbox"]:checked + label::after{
	opacity:1;
	-webkit-transform:rotate(-45deg) scale(1);
	transform:rotate(-45deg) scale(1);
	border-left:2px solid #fff;
	border-bottom:2px solid #fff;
}

.wrp-search h4{
	margin-top:15px;
	padding-top:15px;
	padding-bottom:5px;
	border-top:1px dotted #ccc;
	font-size:1.6rem;
	font-weight:700;
	color:#806040;
}

.wrp-search input[type="text"] {
	width:100%;
    margin-top:5px;
    padding:10px;
	background-color:#fff;
    border:1px solid #ccc;
    border-radius:3px;
}

.wrp-search .btn{
	display:block;
	margin:30px auto 0;
	padding:8px 10px;
	width:60%;
	background-color:#222;
	font-size:1.5rem;
	font-weight:700;
	letter-spacing:.15em;
	text-align:center;
	-webkit-transition:all .4s;
	-o-transition:all .4s;
	transition:all .4s;

}

.wrp-search .btn::before{
    content:"";
    display:inline-block;
    background-image:url(../img/common/icn-search-white.svg);
    background-size:contain;
    position:relative;
    margin-right:5px;
    width:14px;
    height:14px;
    vertical-align:middle;
}

.wrp-search .btn:hover{
	background-color:#a37e39;
	color:#fff;
}

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

.wrp-search h4{
	font-size:1.4rem;
}

.wrp-search .btn{
	margin:30px auto 0;
	width:80%;
}

}













.page-photo .photo-list div{
	padding-top:8px;
	background-color:#fff;
	border-right:1px solid #ddd;
	border-bottom:1px solid #ddd;
	border-left:1px solid #ddd;
}

.page-photo .photo-list div p{
	padding-right:10px;
	padding-left:10px;
	font-weight:700;
}

.page-photo .photo-list dl{
	margin:10px;
	padding-left:5em;
	font-size:1.2rem;
}

.page-photo .photo-list dt,
.page-photo .photo-list dd{
	float:left;
	margin:0;
	line-height:1;
	text-align:left;
}

.page-photo .photo-list dt{
	clear:left;
	float:left;
}

.page-photo .photo-list dd{
	position:relative;
	width:100%;
	white-space:nowrap;
	overflow:hidden;
	-o-text-overflow:ellipsis;
	text-overflow:ellipsis;
}

.page-photo .photo-list dd::after{
	content:"";
	display:block;
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	margin-top:auto;
	margin-bottom:auto;
	border-right:1px dotted #868686;
	width:1px;
	height:10px;
}

.page-photo .photo-list dd span{
	padding-left:10px;
}

.page-photo .photo-list .area1 p{border-left:5px solid #f7a603;}
.page-photo .photo-list .area2 p{border-left:5px solid #eeae79;}
.page-photo .photo-list .area3 p{border-left:5px solid #43a1bf;}
.page-photo .photo-list .area4 p{border-left:5px solid #1b3f5f;}
.page-photo .photo-list .area5 p{border-left:5px solid #95a524;}
.page-photo .photo-list .area6 p{border-left:5px solid #d54939;}


@media screen and (min-width:768px) {

.page-photo .photo-list div p{
	font-size:1.4rem;
}

.page-photo .photo-list dt,
.page-photo .photo-list dd{
	padding:7px 0;
}

.page-photo .photo-list dt{
	margin-left:-5em;
}

}

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

.page-photo .photo-list dt,
.page-photo .photo-list dd{
	padding:4px 0 0;
	font-size:1.1rem;
}

.page-photo .photo-list dl{
	margin:6px 5px 10px;
    padding-left:5em;
}

.page-photo .photo-list dt{
	margin-left:-5em;
}

.page-photo .photo-list dt::before{
	margin-right:0;
}

.page-photo .photo-list dd{
	font-size:1.2rem;
}

.page-photo .photo-list dd::after{
	top:3px;
	height:8px;
}

}



.page-photo .photo-dtl {
    max-width:800px;
    margin:0 auto;
}

.page-photo .photo-dtll img {
    margin: 0 auto;
    width: 800px;
    height: 530px;
    object-fit: contain;
    object-position: 50% 0%;
    font-family: 'object-fit:contain; object-position:50% 0%;';
}


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

.page-photo .photo-dtl img{
	width:100%;
	height:450px;
}

}

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

.page-photo .photo-dtl img{
	height:250px;
}


}

























.photo-info-box{
	margin-top:30px;
	border-style:solid;
	border-width:3px;
	border-color:#e6e6e6;
}

.photo-basic{
	border-top-color:#825A32;
}

.photo-dtl-ttl{
	padding:15px 0 15px 15px;
	font-size:1.8rem;
	font-weight:700;
	letter-spacing:.2em;
	background-repeat:no-repeat;
}

.photo-info-photo{
	margin:50px auto;
	padding-right:50px;
	padding-left:50px;
	text-align:center;
}

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

.photo-dtl-ttl{
	padding:10px;
	font-size:1.6rem;
	letter-spacing:0;
}

.photo-info-photo{
	margin:25px auto;
	padding-right:15px;
	padding-left:15px;
}

}

.photo-table-box{
	padding-right:15px;
	padding-left:15px;
	border-top:solid 1px #e6e6e6;
}

.photo-table{
	width:100%;
	border-collapse:collapse;
}

.photo-table th,
.photo-table td{
	padding:15px 10px;
	border-bottom:solid 1px #e6e6e6;
}

.photo-table th{
	width:15%;
	vertical-align:middle;
	font-weight:700;
}

.photo-table td .rule-link{
	margin-top:10px;
}

.photo-table td .rule-link a{
	color:#0093AF;
	text-decoration:underline;
}

.photo-table td .rule-link a:hover{
	text-decoration:none;
}

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


.photo-table th,
.photo-table td{
	padding:10px 0;
}

.photo-table td{
	padding-top:0;
}

.photo-table th{
    display:block;
    border-top:none;
    border-bottom: none;
    width:100%;
	text-align:left;
}


.photo-table td{
	display:block;
}

}


.photo-table .by-train li:first-child,
.photo-table .by-car li:first-child,
.photo-table .by-other li:first-child{
	background-color:#eee;
}

.photo-table .by-car,
.photo-table .by-other{
	margin-top:10px;
	padding-top:10px;
	border-top:1px dotted #e3e3e3;
}

@media screen and (min-width:768px) {

.photo-table .by-train li:first-child,
.photo-table .by-car li:first-child,
.photo-table .by-other li:first-child{
	float:left;
	width:20%;
	margin-right:2%;
	text-align:center;
}

.photo-table .by-train li:last-child,
.photo-table .by-car li:last-child,
.photo-table .by-other li:last-child{
	float:left;
	width:78%;
}

}

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

.photo-table .by-train li:first-child,
.photo-table .by-car li:first-child,

.photo-table .by-other li:first-child{
	margin-bottom:10px;
	padding-right:5px;
	padding-left:10px;
}

}


















































































.search-number{
	margin:50px 0;
	padding:20px 0;
	border-top:1px dotted #dadada;
	border-bottom:1px dotted #dadada;
	font-size:1.4rem;
	font-weight:700;
	text-align:center;
}

.search-number ul li:last-child{
	margin-left:auto;
}

.search-number dl dt{
	float:left;
	clear:left;
}

.search-number dl dd{
	padding-left:80px;
	text-align:left;
}

.search-number em{
	padding:0 6px;
	color:#B97103;
	font-family:Arial, Helvetica, sans-serif;
	font-size:2.8rem;
	vertical-align:middle;
	line-height:1;
}

@media screen and (min-width:768px) {

.search-number ul{
	display:-webkit-box;
	display:-moz-box;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:flex;
	-webkit-box-align:center;
	-ms-flex-align:center;
	align-items:center;
	justify-content:center;
}

}

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

.search-number{
	margin:25px 0;
	padding:5px 0;
	font-size:1.3rem;
}

.search-number em{
	font-size:2.4rem;
}

}


.g-map{
	position:relative;
	margin-top:30px;
	padding-bottom:38%;
	height:0;
	overflow:hidden;
	border:1px solid #ddd;
}

.g-map iframe{
	position:absolute;
	padding:5px;
	top:0;
	left:0;
	width:100% !important;
	height:350px !important;
}

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

.g-map{
	padding-bottom:75%;
}

.g-maps iframe{
	height:100% !important;
}

}






.rule-box{
	max-width:900px;
	margin:0 auto;
}


.rule-box .lead{
	font-size:14px;
	font-size:1.4rem;
}

.rule-box h3{
	margin:40px 0 10px;
	padding-bottom:5px;
	border-bottom:1px dotted #dadada;
	font-size:16px;
	font-size:1.6rem;
	font-weight:700;
}

.rule-box h4{
	margin:30px 0 10px;
	font-size:14px;
	font-size:1.4rem;
	font-weight:700;
}

.rule-box p,
.rule-box ul li{
	margin:0 20px;
}

.rule-box .rule-lead p:nth-child(n+2){
	margin-top:25px;
}


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

.page-rule{
	width:94%;
}


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

.rule-box .lead,
.rule-box h4{
	font-size:13px;
	font-size:1.3rem;
}

.rule-box p,
.rule-box ul li{
	margin:0;
}

.rule-box h3{
	margin:20px 0 10px;
	padding-bottom:5px;
	font-size:14px;
	font-size:1.4rem;
}

.rule-box h4{
	margin:20px 0 10px;
}

.rule-box .rule-lead p:nth-child(n+2){
	margin-top:15px;
}

}