/* CSS Document */
#gop_wap img{
	width: 100%;
	max-width: 100%;
	height: auto;
}
#gop_wap a{
	outline: none;
}
#gop_wap *:focus {
	outline: none;
}

#gop_wap{
	background-color: #ffffff;
	background-size: 100%;
	width: auto;
	height: auto;
	margin: 0 auto;
	text-align: center;
	outline: none;
}


/*****************************************************************************
****************** 共通 ******************************************************
*****************************************************************************/
#gop_allcon{
	max-width: 1280px;
	width: auto;
	margin: 0 auto;
	text-align: center;
	height: auto;
}
.gop_pc{
	display: block;
}
.gop_sm{
	display: none;
}
@media screen and (max-width: 767px) {
	.gop_pc{
		display: none;
	}
	.gop_sm{
		display: block;
	}
}

.gop_contents{
}
.gop_contents .gop_top{

}
.gop_pamphlet-con,
#gop_wap .gop_video .container-fluid,
.gop_food-con{
	max-width: 978px;
	width: auto;
	margin: 0 auto;
}
@media screen and (max-width: 767px) {
	.gop_pamphlet-con,
	#gop_wap .gop_video .container-fluid,
	.gop_food-con{
		width: 94%;
	}
}

/*****************************************************************************
****************** 観光パンフレット *******************************************
*****************************************************************************/
#gop_wap .gop_pamphlet{
	background-color: #F8F7F4;
	padding: 4% 0;
	overflow: hidden;
}
.gop_pamphlet .lang{
	padding-top: 3%;
	width: 15%;
	margin: 0 auto;
}
.gop_pamphlet-con{
	padding-top: 4%;
}
.gop_pamphlet .pamp-list-3{
	display: inline-block;
	padding-bottom: 5%;
}
#gop_wap .gop_book {
	margin-bottom: 10%;
}
#gop_wap .gop_book a:hover img{
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}
@media screen and (max-width: 767px) {
	#gop_wap .gop_pamphlet{
		padding: 8% 0;
	}
	.gop_pamphlet .lang{
		width: 30%;
	}
}

/*****************************************************************************
****************** 五ヶ瀬ムービー *********************************************
*****************************************************************************/
#gop_wap .gop_video{
	padding: 4% 0;
}
#gop_wap .gop_video a:hover img{
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}
#gop_wap .gop_video .container-fluid{
	padding-top: 4%;
}
#gop_wap .gop_video-words{
	text-align: left;
	line-height: 180%;
}
#gop_wap .gop_video-words a{
	text-decoration: underline;
}
#gop_wap .gop_video-words a:hover{
	text-decoration: none;
}
#gop_wap .gop_video-words .adjustment{
	font-size: 120%;
	font-weight: bold;
	padding-bottom: 4%;
}
#gop_wap .gop_video-link{
	padding: 0;
}
@media screen and (max-width: 767px) {
	#gop_wap .gop_video{
		padding: 8% 0;
	}
	#gop_wap .gop_video-words .adjustment{
		font-size: 3.5vw;
		text-align: center;
		font-weight: normal;
	}
	#gop_wap .gop_video-link{
		display: none;
	}
}

/*****************************************************************************
****************** 五ヶ瀬フード ***********************************************
*****************************************************************************/
#gop_wap .gop_food{
	background-color: #F8F7F4;
	padding: 4% 0;
	overflow: hidden;
}
.gop_food-con{
	padding-top: 4%;
}
.gop_food-con a{
	overflow: hidden;
	display: block;
}
#gop_wap .gop_food img{
	border-radius: 10px;
}
#gop_wap .gop_food a:hover img{
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}
#gop_wap .gop_food .adjustment{
	font-weight: bold;
	padding-top: 4%;
	text-align: left;
}
@media screen and (min-width: 768px) {
	.gop_food-words,
	.gop_food-img{
		padding:0;
	}
}
@media screen and (max-width: 767px) {
	#gop_wap .gop_food{
		padding: 8% 0;
	}
	.gop_food-article{
		padding-bottom: 5%;
	}
	.gop_food-words{
		padding-right: 0;
	}
	.gop_food-img{
		padding:0;
	}
}

/*****************************************************************************
****************** Bootstrap 5等分css ****************************************
*****************************************************************************/
.col-xs-1-5, .col-sm-1-5, .col-md-1-5, .col-lg-1-5,
.col-xs-2-5, .col-sm-2-5, .col-md-2-5, .col-lg-2-5,
.col-xs-3-5, .col-sm-3-5, .col-md-3-5, .col-lg-3-5,
.col-xs-4-5, .col-sm-4-5, .col-md-4-5, .col-lg-4-5 {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}
.col-xs-1-5 {
    width: 20%;
    float: left;
}
.col-xs-2-5 {
    width: 40%;
    float: left;
}

.col-xs-3-5 {
    width: 60%;
    float: left;
}

.col-xs-4-5 {
    width: 80%;
    float: left;
}
@media (min-width: 768px) {
    .col-sm-1-5 {
        width: 20%;
        float: left;
    }
    .col-sm-2-5 {
        width: 40%;
        float: left;
    }
    .col-sm-3-5 {
        width: 60%;
        float: left;
    }
    .col-sm-4-5 {
        width: 80%;
        float: left;
    }
}
@media (min-width: 992px) {
    .col-md-1-5 {
        width: 20%;
        float: left;
    }
    .col-md-2-5 {
        width: 40%;
        float: left;
    }
    .col-md-3-5 {
        width: 60%;
        float: left;
    }
    .col-md-4-5 {
        width: 80%;
        float: left;
    }
}
@media (min-width: 1200px) {
    .col-lg-1-5 {
        width: 20%;
        float: left;
    }
    .col-lg-2-5 {
        width: 40%;
        float: left;
    }
    .col-lg-3-5 {
        width: 60%;
        float: left;
    }
    .col-lg-4-5 {
        width: 80%;
        float: left;
    }
}

/*****************************************************************************
****************** bootstrap調整 *********************************************
*****************************************************************************/
ul{
	margin-bottom: 0;
}
