@charset "UTF-8";

/* PCでは非表示 */
.pc_no{display: none;}




/* -------------------------- */
/* --------header-------- */
/* -------------------------- */

header{
border-top: solid 30px #064280;/* 上部のライン */
text-align: center;
padding-bottom: 10px;
}

/* ロゴ */
header div{margin: 25px 0 10px 0;}

/* ページタイトル */
/*
header h1 {
font-family: 'ヒラギノUD明朝 W4 JIS2004';
letter-spacing: 2px;
font-size: 3.6em;
font-weight: 200;
margin-bottom: 20px;
}
*/
h1.wf-h1 {
font-family: 'ヒラギノUD明朝 W4 JIS2004';
letter-spacing: 2px;
font-size: 3.6em;
font-weight: 200;
margin-bottom: 20px;
}
/* 北海道地図 */
header h1 img{margin: -70px -240px 0 0;}




/* -------------------------- */
/* --------main フェード-------- */
/* -------------------------- */

/* PCのサイズ　メインフェード */
.crossfade {
width: 100%;
height: 600px;
position:relative;
}

/* PCのサイズ　メインコピー */
.main_copy{
top: 450px;
font-size: 3.0em;
text-shadow: 0px 0px 15px #000000;
}


/* -------------------------- */
/* ----------banner---------- */
/* -------------------------- */


.banner {
  /*  position: relative; */
}

/* -------------------------- */
/* .banner p {
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    margin:0;
    padding:0;
    position: absolute;
    color: white;
   
}
p.banner_01{
    font-size: 1.5em;
    padding: 3px 0;
    font-family :'ヒラギノUD明朝 W4 JIS2004';
}
p.banner_02{
    font-size: 2.5em;
    padding: padding-top:100px;
    font-family :'ヒラギノUD明朝 W4 JIS2004';
}
p.banner_03{
    font-size: 2em;
    padding: 100px 0;
    font-family :'ヒラギノUD明朝 W4 JIS2004';
}
*/
    



img.addBannerJPG {
	width: 1000px;
	margin: 0 auto 0 auto;
	display: block;
}




/* -------------------------- */
/* -----content 1000px囲み----- */
/* -------------------------- */
.content{
width: 1000px;
margin: 80px auto;
overflow: hidden;
}




/* -------------------------- */
/* --------タイトル-------- */
/* -------------------------- */

/* PCの文字サイズ */
.title_01 h1{
padding-top:30px;padding-bottom: 45px;
font-size: 2.6em;

}
/* PCの文字サイズ */
.title_02{font-size: 2.4em;}





/* -------------------------- */
/* --------ボタン-------- */
/* -------------------------- */
.bt_01 a{display: block; padding: 3px 0;}
.bt_02 {padding: 30px 0;}
.bt_02 a{font-size: 1.5em; padding: 30px 150px;}
.bt_03 a{display: block; font-size: 1.5em; padding: 30px 0;}




/* -------------------------- */
/* --------ランキング-------- */
/* -------------------------- */


.rank ul{
display: -ms-flexbox; /* IE10 */
display: -webkit-box; /* Android4.3以下、Safari3.1〜6.0 */
display: -webkit-flex; /* Safari6.1以降 */
display: flex;
/*配列順序（左から右へ） */
-ms-flex-direction: row; /*IE10*/
-webkit-box-direction: row; /* Android4.3以下、Safari3.1〜6.0 */
-webkit-flex-direction: row; /* Safari */
flex-direction: row;
/*行指定（複数行に跨り、上から下へ） */
-ms-flex-wrap: wrap; /*IE10*/
-webkit-flex-wrap: wrap; /* Safari6.1以降 */
flex-wrap: wrap;
}

.rank ul li{
list-style: none;
width: 310px;
margin:50px 0 0 35px;
position:relative;
padding-bottom: 25px;
}


/* 詳細ボタンを下部へ */
.rank ul li span{
position:absolute;
bottom:0;
width: 100%;
}

/* 詳細ボタン分の空きを作る */
.rank ul li p{margin-bottom: 40px;}


/* １、4番目のmargin-left解除 */
.rank li:nth-child(1),.rank li:nth-child(4),.rank li:nth-child(7),.rank li:nth-child(10)
{margin:50px 0 0 0;}

/* 順位文字の大きさ */
.rank li h2{font-size: 2.0em;}

/* 番号の文字 */
.rank li h4{font-weight: 100;}




/* -------------------------- */
/* --------街の紹介-------- */
/* -------------------------- */

.city-info-01,.city-info-02{
margin: 100px 0;
overflow: hidden;
}
/* 写真 */
.city-info-01 img{float: left; margin-right: 55px;}
.city-info-02 img{float:right; margin-left: 55px;}






/* -------------------------- */
/* --------外部リンク一覧-------- */
/* -------------------------- */

.link{width: 80%; margin: 0 auto;}

.link li{
float: left;
list-style: none;
width: 48%;
margin-left: 24px;
margin-bottom: 24px;
}
/* 奇数のmargin解除 */
.link li:nth-child(2n+1){margin-left: 0;}





/* -------------------------- */
/* ------返礼品スライダー------ */
/* -------------------------- */

.henrei{text-align: center; margin: 100px 0 100px 0;}


/* 返礼品スライダー */
#loopslider {
margin: 0 auto;
width: 100%;
height: 190px;
text-align: left;
position: relative;
overflow:hidden;
}

/* スライダー　pcの幅を大きく */
#loopslider ul li {
width: 285px;
height: 195px;
float: left;
display: inline;
overflow: hidden;
}





/* -------------------------- */
/* ------フッター------ */
/* -------------------------- */

/* 内容囲み */
footer section{
width: 1000px;
margin: 50px auto;
color:#FFF;
overflow: hidden;
}

/* 会社名とロゴ */
footer section h1{
float: left;
font-family: 'ヒラギノUD明朝 W4 JIS2004';
font-size: 2.0em;
font-weight: 100;
letter-spacing: 2px;
margin-right: 60px;
}
footer section h1 img{display: block; margin: 0 0 20px 150px;}

/* 会社のアドレス */
footer section div {float: left;}
footer section div a{color: #FFF;}



/* -------------------------- */
/* ----------下部バナー-------- */
/* -------------------------- */

.last-banner{
    /*display: flex;
    flex-wrap:wrap;*/
    margin : 0 auto 0px auto;
	text-align: center;
}
/*.last-banner li {
	width: calc(100%/3);
	padding:0 5px;
	box-sizing:border-box;
    list-style: none;
}
*/
.last-banner img {
	max-width:100%;
	height: auto;
}




