@charset "utf-8";

/*--------------------------------------------------*/
/*		http://www.sapporo-koshi.jp/sp/
/*		css/common.css
/*--------------------------------------------------*/
/*		$index
/*--------------------------------------------------*/
/*			$index......目次
/*			$reset......リセットcss
/*			$font.......ウェブフォントcss
/*			$layout.....全体のレイアウト
/*			$parts......共通パーツレイアウト
/*			$header.....ヘッダレイアウト
/*			$footer.....フッタレイアウト
/*--------------------------------------------------*/



/*--------------------------------------------------*/
/*			$reset
/*--------------------------------------------------*/
*{box-sizing: border-box; margin:0; padding:0; text-align:left;}
hr{display:none; margin:0; padding:0; border:none; font-size:0; line-height:0;}
a{color:inherit; text-decoration:none;/* -webkit-transition: all 0.4s ease; transition: all 0.4s ease;*/}
/*a.none:hover{cursor: default;}*/
ul,ol{list-style:none;}
address{font-style:normal;}
p{line-height:1.6;}
i{font-style: normal;}
img{max-width:100%; border:none;}
.fleft{float:left;}
.fright{float:right;}
.clear:after,.clear:before{content:""; display:block; overflow:hidden; height:0;}
.clear:after{clear:both;}
.clear{zoom:1;}



/*--------------------------------------------------*/
/*			$font
/*--------------------------------------------------*/
@font-face{
font-family: 'Noto Sans JP';
font-style: normal;
font-weight: 400;
src: url(/sp/fonts/notosans/NotoSansJP-Regular.woff2) format('woff2'),url(/sp/fonts/notosans/NotoSansJP-Regular.woff) format('woff'),url(/sp/fonts/notosans/NotoSansJP-Regular.otf) format('opentype');
font-display: swap;
}
@font-face{
font-family: 'Noto Sans JP';
font-style: normal;
font-weight: 700;
src: url(/sp/fonts/notosans/NotoSansJP-Bold.woff2) format('woff2'),url(/sp/fonts/notosans/NotoSansJP-Bold.woff) format('woff'),url(/sp/fonts/notosans/NotoSansJP-Bold.otf) format('opentype');
font-display: swap;
}



/*--------------------------------------------------*/
/*			$layout
/*--------------------------------------------------*/
html,body{width:100%; height:auto;}
html{font-size:62.5%; font-family:"Noto Sans JP","游ゴシック", YuGothic, "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Meiryo, "メイリオ", "MS PGothic", sans-serif;}
body{position:relative;	background:#fff; color:#333; font-size: 1.0em; font-weight: 400; line-height:1.8;}
.solid-inner{position:relative; width:90.625%; margin:0 auto;}
.flex{display:-webkit-flex; display:flex; -webkit-flex-wrap: wrap; flex-wrap: wrap;}



/*--------------------------------------------------*/
/*			$parts
/*--------------------------------------------------*/
.tit01{padding: 0 0 1em .8em; background: url(/sp/images/icon01.png) no-repeat left .6rem; background-size: 3px auto; color: #802506; font-size: 1.2rem; font-weight: 700;}


/*--------------------------------------------------*/
/*			$header
/*--------------------------------------------------*/
#header{position: fixed; z-index: 9999; width: 100%; background: rgb(255,255,255);
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 70%, rgba(222,199,191,1) 100%);
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(255,255,255,1) 70%,rgba(222,199,191,1) 100%);
background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(255,255,255,1) 70%,rgba(222,199,191,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dec7bf',GradientType=0 );}
#header.on{background: #fff;}
#header a{-webkit-transition: all 0.4s ease; transition: all 0.4s ease;}
#header h1{width: 45.625%; padding: 3.125% 4.6875%; font-size: 0; line-height: 0;}
#header #btn-menu{position: absolute; right: 4.6875%; top: 25%; width: 7.8125%;}
#header.on #btn-menu{background: url(/sp/images/btn_close.png) no-repeat center center; background-size: 100% auto;}
#header.on #btn-menu img{opacity: 0;}
#header #gnavi{display: none; position: absolute; left: 0; top: 100%; width: 100%; padding-top: 1rem; background-color: #fff;}
#header #gnavi li{border-bottom: 1px #000 solid;}
#header #gnavi li a{display: block; padding: 1rem; background: url(/sp/images/arrow01.png) no-repeat 95% center; background-size: 4px auto; font-size: 1.2rem; font-weight: 700; line-height: 1;}
#header #gnavi li dl{padding: 1rem 3.125% 0; font-size: 1.2rem; font-weight: 700; line-height: 1;}
#header #gnavi li li:last-child{border-bottom: none;}


/*--------------------------------------------------*/
/*			$footer
/*--------------------------------------------------*/
#footer #ftop{padding-bottom: 4.6875%;}
#footer #ftop>ul li{padding-bottom: 3.125%; font-size: 0; line-height: 0;}
#footer #ftop dl{margin-bottom: 3.125%; padding: 3.125% 2.34375%; background: url(/sp/images/finq_bg.png) no-repeat; background-size: 100% 100%;}
#footer #ftop dt{width: 31.090%; padding-bottom: 3.125%; font-size: 0; line-height: 0;}
#footer #ftop dd li{padding-bottom: 2.34375%; font-size: 0; line-height: 0;}
#footer #ftop dd li:last-child{padding-bottom: 0;}
#footer #ftop p{width: 82.758%; margin: 0 auto; font-size: 0; line-height: 0;}
#footer #fbottom{background-color: #181412;}
#footer #fbottom .inner{position: relative; padding-top: 3.90625%; background: -moz-linear-gradient(top, rgba(209,197,133,0.15) 0%, rgba(255,255,255,0) 100%);
background: -webkit-linear-gradient(top, rgba(209,197,133,0.15) 0%,rgba(255,255,255,0) 100%);
background: linear-gradient(to bottom, rgba(209,197,133,0.15) 0%,rgba(255,255,255,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#26d1c585', endColorstr='#00ffffff',GradientType=0 );}
#footer #fbottom aside{position: absolute; top: 0; right: 4.6875%; width: 23.4375%; margin-top: -1.5625%; text-align: right; font-size: 0; line-height: 0;}
#footer #fbottom ul{-webkit-justify-content: space-between; justify-content: space-between;}
#footer #fbottom ul li{width: 49%; padding: 0 0 1.5rem 1rem; background: url(/sp/images/arrow02.png) no-repeat left .8rem; background-size: 4px auto;}
#footer #fbottom ul li a{color: #cfb949; font-size: .8rem; text-decoration: underline;}
#footer #fbottom dl{margin-bottom: 4.6875%; padding: 3.125% 2.34375%; background-color: #25211a;}
#footer #fbottom dt{width: 64.855%; padding-bottom: 3.125%; font-size: 0; line-height: 0;}
#footer #fbottom dd{color: #c0b57c; font-size: .9rem;}
#footer #fbottom dd span{margin-right: 2em;}
#footer #fbottom dd a{text-decoration: underline;}
#footer .copyright{padding-bottom: 4em; color: #c0b57c; font-size: .7rem; text-align: center;}