@charset "utf-8";
@media screen and (min-width:641px){
/*pc_defaultset*/
.pc { display: block !important; }/*pcのみ表示ブロック*/
.sp { display: none !important; }/*スマホのみ表示ブロック*/
.h_menu {display: none;}/*スマホ用ニュー*/
#sp_global_nav{display: none;}/*スマホ用ニュー*/
.pc-ten-ce { display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; }
}
@media screen and (max-width:640px) {
.f-bottom-Box{
position: fixed;
bottom: 0;
}
.sp-ten-t {-webkit-box-direction:normal;-moz-box-direction:normal;-webkit-box-orient:vertical;-moz-box-orient:vertical;-webkit-flex-direction:column;-moz-flex-direction:column;flex-direction:column; }
/*sp_defaultset*/
html{font-size: 62.5%;}
body {overflow-x: hidden;font-size: 1.6rem;-webkit-text-size-adjust: 100%;}
.pc { display: none !important; }/*pcのみ表示ブロック*/
.sp { display: block !important; }/*スマホのみ表示ブロック*/
.no-br{display: none;}/*スマホでbrを解除したい場合に使用*/
.sp_display_block { display: block !important;}/*スマホでflexboxを解除したい場合等に使用*/
.h_tel_fix {background: #c6c6c6;position: fixed;bottom: 0;left: 0;width: 100%;z-index: 9999;overflow: hidden;}/*ページ下部固定電話・メール*/
.h_tel_fix img:last-child {width: 22%;}
img{width: 100%;}
nav#sp_global_nav { z-index: 9999;overflow: scroll;position: fixed;top: 0;width: 100vw;height: 100vh;display: none;background: rgba(105,12,16,0.98);padding: 5% 5% 30%;box-sizing: border-box;color: #fff;}/*スマホ用ニュー*/
nav#sp_global_nav li a {color: #fff;font-size: 1.6rem;line-height: 1.4;text-decoration: none;padding: 5% 0;display: block;border-bottom: 1px solid #520609;}/*スマホ用ニュー*/
nav#sp_global_nav .closebtn {text-align: center;background: #000;color: #fff;margin: 2rem 0 0 0;font-size: 1.6rem;font-weight: bold;padding: 1rem;}/*スマホ用ニュー*/
.wysiwyg img{width:auto !important;height:auto !important;}/*ウィジウィグ内画像の縦横比調整*/
/*その他注意*/
/*基本的にaタグにはdisplay:block;をつけてクリッカブル領域を確保する*/
/*スマホ用メニュー内でアンカーリンクの項目がある場合は、class="closebtn"をつけておく*/
/*フォントサイズは基本的にremかemで指定*/
/*横幅は基本的に%かemかremで指定、vwはあまり使用しない*/
/*vhはメニュー部分以外使用しない*/
/*tableは基本的にtdとthにdisply:block;*/
.sp-order { -webkit-box-ordinal-group: -1; -moz-box-ordinal-group: -1; -webkit-flex-order: -1; -moz-flex-order: -1; -webkit-order: -1; -moz-order: -1; order: -1; }
.sp-ten{ display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; }
.sp-ten-ce { display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; }
}
/* Antialiasing ※任意 */
html{-webkit-font-smoothing: subpixel-antialiased;-moz-osx-font-smoothing: none;}
/* WEB FONTs 游ゴシックかすれ予防*/
@font-face {
font-family: "Yu Gothic";
src: local("Yu Gothic Medium");
font-weight: 100;
}
@font-face {
font-family: "Yu Gothic";
src: local("Yu Gothic Medium");
font-weight: 200;
}
@font-face {
font-family: "Yu Gothic";
src: local("Yu Gothic Medium");
font-weight: 300;
}
@font-face {
font-family: "Yu Gothic";
src: local("Yu Gothic Medium");
font-weight: 400;
}
@font-face {
font-family: "Yu Gothic";
src: local("Yu Gothic Bold");
font-weight: bold;
}
@font-face {
font-family: "Helvetica Neue";
src: local("Helvetica Neue Regular");
font-weight: 100;
}
@font-face {
font-family: "Helvetica Neue";
src: local("Helvetica Neue Regular");
font-weight: 200;
}
.f-min {
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
}
.f-min_02 {
font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3","Sawarabi Mincho","Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.f-gothic{
font-family:-apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-weight: 500;
}
body {
overflow-x: hidden;
-webkit-text-size-adjust: 100%;
}
img {
vertical-align: bottom;
}
a { text-decoration: none; color: #090909; }
a:hover { text-decoration: underline; }
.nobd a:hover { text-decoration: none !important; }
/*-----float-----*/
.fl_l {
float: left;
}
.fl_r {
float: right;
}
.cl_both {
clear: both;
}
/*-----font-----*/
.fw_b {
font-weight: bold;
}
.ta_r {
text-align: right;
}
.ta_c {
text-align: center;
}
.ta_l {
text-align: left;
}
/* IE10以上 不要なら削除 */
@media all and (-ms-high-contrast: none) {
body {
font-family: Verdana, Meiryo, sans-serif;
}
}
/* Margin-Top & Padding-Top */
.mt00 { margin-top: 0px; } .pt00 { padding-top: 0px; }
.mt05 { margin-top: 5px; } .pt05 { padding-top: 5px; }
.mt10 { margin-top: 10px; } .pt10 { padding-top: 10px; }
.mt15 { margin-top: 15px; } .pt15 { padding-top: 15px; }
.mt20 { margin-top: 20px; } .pt20 { padding-top: 20px; }
.mt25 { margin-top: 25px; } .pt25 { padding-top: 25px; }
.mt30 { margin-top: 30px; } .pt30 { padding-top: 30px; }
.mt35 { margin-top: 35px; } .pt35 { padding-top: 35px; }
.mt40 { margin-top: 40px; } .pt40 { padding-top: 40px; }
.mt45 { margin-top: 45px; } .pt45 { padding-top: 45px; }
.mt50 { margin-top: 50px; } .pt50 { padding-top: 50px; }
.mt55 { margin-top: 55px; } .pt55 { padding-top: 55px; }
.mt60 { margin-top: 60px; } .pt60 { padding-top: 60px; }
.mt65 { margin-top: 65px; } .pt65 { padding-top: 65px; }
.mt70 { margin-top: 70px; } .pt70 { padding-top: 70px; }
.mt75 { margin-top: 75px; } .pt75 { padding-top: 75px; }
.mt80 { margin-top: 80px; } .pt80 { padding-top: 80px; }
.mt85 { margin-top: 85px; } .pt85 { padding-top: 85px; }
.mt90 { margin-top: 90px; } .pt90 { padding-top: 90px; }
.mt95 { margin-top: 95px; } .pt95 { padding-top: 95px; }
.mt100{ margin-top:100px; } .pt100{ padding-top:100px; }
/* Margin-Right & Padding-Right */
.mr00 { margin-right: 0px; } .pr00 { padding-right: 0px; }
.mr05 { margin-right: 5px; } .pr05 { padding-right: 5px; }
.mr10 { margin-right: 10px; } .pr10 { padding-right: 10px; }
.mr15 { margin-right: 15px; } .pr15 { padding-right: 15px; }
.mr20 { margin-right: 20px; } .pr20 { padding-right: 20px; }
.mr25 { margin-right: 25px; } .pr25 { padding-right: 25px; }
.mr30 { margin-right: 30px; } .pr30 { padding-right: 30px; }
.mr35 { margin-right: 35px; } .pr35 { padding-right: 35px; }
.mr40 { margin-right: 40px; } .pr40 { padding-right: 40px; }
.mr45 { margin-right: 45px; } .pr45 { padding-right: 45px; }
.mr50 { margin-right: 50px; } .pr50 { padding-right: 50px; }
.mr55 { margin-right: 55px; } .pr55 { padding-right: 55px; }
.mr60 { margin-right: 60px; } .pr60 { padding-right: 60px; }
.mr65 { margin-right: 65px; } .pr65 { padding-right: 65px; }
.mr70 { margin-right: 70px; } .pr70 { padding-right: 70px; }
.mr75 { margin-right: 75px; } .pr75 { padding-right: 75px; }
.mr80 { margin-right: 80px; } .pr80 { padding-right: 80px; }
.mr85 { margin-right: 85px; } .pr85 { padding-right: 85px; }
.mr90 { margin-right: 90px; } .pr90 { padding-right: 90px; }
.mr95 { margin-right: 95px; } .pr95 { padding-right: 95px; }
.mr100{ margin-right:100px; } .pr100{ padding-right:100px; }
/* Margin-Bottom & Padding-Bottom */
.mb00 { margin-bottom: 0px; } .pb00 { padding-bottom: 0px; }
.mb05 { margin-bottom: 5px; } .pb05 { padding-bottom: 5px; }
.mb10 { margin-bottom: 10px; } .pb10 { padding-bottom: 10px; }
.mb15 { margin-bottom: 15px; } .pb15 { padding-bottom: 15px; }
.mb20 { margin-bottom: 20px; } .pb20 { padding-bottom: 20px; }
.mb25 { margin-bottom: 25px; } .pb25 { padding-bottom: 25px; }
.mb30 { margin-bottom: 30px; } .pb30 { padding-bottom: 30px; }
.mb35 { margin-bottom: 35px; } .pb35 { padding-bottom: 35px; }
.mb40 { margin-bottom: 40px; } .pb40 { padding-bottom: 40px; }
.mb45 { margin-bottom: 45px; } .pb45 { padding-bottom: 45px; }
.mb50 { margin-bottom: 50px; } .pb50 { padding-bottom: 50px; }
.mb55 { margin-bottom: 55px; } .pb55 { padding-bottom: 55px; }
.mb60 { margin-bottom: 60px; } .pb60 { padding-bottom: 60px; }
.mb65 { margin-bottom: 65px; } .pb65 { padding-bottom: 65px; }
.mb70 { margin-bottom: 70px; } .pb70 { padding-bottom: 70px; }
.mb75 { margin-bottom: 75px; } .pb75 { padding-bottom: 75px; }
.mb80 { margin-bottom: 80px; } .pb80 { padding-bottom: 80px; }
.mb85 { margin-bottom: 85px; } .pb85 { padding-bottom: 85px; }
.mb90 { margin-bottom: 90px; } .pb90 { padding-bottom: 90px; }
.mb95 { margin-bottom: 95px; } .pb95 { padding-bottom: 95px; }
.mb100{ margin-bottom:100px; } .pb100{ padding-bottom:100px; }
/* Margin-Left & Padding-Left */
.ml00 { margin-left: 0px; } .pl00 { padding-left: 0px; }
.ml05 { margin-left: 5px; } .pl05 { padding-left: 5px; }
.ml10 { margin-left: 10px; } .pl10 { padding-left: 10px; }
.ml15 { margin-left: 15px; } .pl15 { padding-left: 15px; }
.ml20 { margin-left: 20px; } .pl20 { padding-left: 20px; }
.ml25 { margin-left: 25px; } .pl25 { padding-left: 25px; }
.ml30 { margin-left: 30px; } .pl30 { padding-left: 30px; }
.ml35 { margin-left: 35px; } .pl35 { padding-left: 35px; }
.ml40 { margin-left: 40px; } .pl40 { padding-left: 40px; }
.ml45 { margin-left: 45px; } .pl45 { padding-left: 45px; }
.ml50 { margin-left: 50px; } .pl50 { padding-left: 50px; }
.ml55 { margin-left: 55px; } .pl55 { padding-left: 55px; }
.ml60 { margin-left: 60px; } .pl60 { padding-left: 60px; }
.ml65 { margin-left: 65px; } .pl65 { padding-left: 65px; }
.ml70 { margin-left: 70px; } .pl70 { padding-left: 70px; }
.ml75 { margin-left: 75px; } .pl75 { padding-left: 75px; }
.ml80 { margin-left: 80px; } .pl80 { padding-left: 80px; }
.ml85 { margin-left: 85px; } .pl85 { padding-left: 85px; }
.ml90 { margin-left: 90px; } .pl90 { padding-left: 90px; }
.ml95 { margin-left: 95px; } .pl95 { padding-left: 95px; }
.ml100{ margin-left:100px; } .pl100{ padding-left:100px; }
/* clearfix */
.clearfix {zoom: 1;}
.clearfix:after {
display: block;
clear: both;
height: 0;
visibility: hidden;
line-height: 0;
content: ".";
}
/* Margin-Center */
.ma-ce{margin-right: auto; margin-left: auto;}
/* TextAlign */
.al { text-align: left; }
.ar { text-align: right; }
.ac { text-align: center; }
/* Float */
.fl { float: left; }
.fr { float: right; }
.clear { clear:both; }
/* position */
.poa{ position:absolute;}
.rel{ position:relative;}
/* wysiwyg */
.wysiwyg strong{font-weight: bolder}
.wysiwyg em{font-family: "ＭＳ ゴシック",sans-serif; font-style: italic;}
.wysiwyg img{max-width:100% !important;height: auto !important;}
.wysiwyg h1 { font-size: 2em; margin: .67em 0 }
.wysiwyg h2 { font-size: 1.5em; margin: .75em 0 }
.wysiwyg h3 { font-size: 1.17em; margin: .83em 0 }
.wysiwyg h4 { margin: 1.12em 0 }
.wysiwyg h5 { font-size: .83em; margin: 1.5em 0 }
.wysiwyg h6 { font-size: .75em; margin: 1.67em 0 }
.wysiwyg {word-wrap: break-word;}
/* img_block */
.img-b img{display:block;}
/* ※なので、2行目の1文字目を空ける時 */
.indent{padding-left:1em;text-indent:-1em;}
.indent-list li{padding-left:1em;text-indent:-1em;}
/*----------------------------------------
よく使うcss用 サンプル
----------------------------------------*/
/* アンカーリンク調整 */
.hideAnchor {display:block;height:0px;overflow:hidden;text-indent:-9999px;margin-top:-10px;padding-bottom:10px;}
/* スクロール縦 */
.scroll_y{box-sizing: border-box;overflow-y: scroll;transform: translateZ(0);}
/* 背景2つ 1番目が前 2番目が後ろ */
.w-bg{background: url(../images/web/bg_01.png) 445px 20px no-repeat, url(../images/web/ptn_01.jpg) left top repeat;}
/* リンク透明 */
a img:hover {-ms-filter: "alpha( opacity=80 )";filter: alpha( opacity=80 );opacity: 0.8;}
/* リンク透明にしない */
.noop a img:hover {-ms-filter: "alpha( opacity=100 )";filter: alpha( opacity=100 );opacity: 1.0;}
/*----------------------------------------
外部サービス
----------------------------------------*/
/* ggmap */
/* iframeのコピーしたコード
*/
.ggmap {position: relative;padding-bottom: 56.25%;padding-top: 30px;height: 0;overflow: hidden;}
.ggmap iframe,
.ggmap object,
.ggmap embed {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
/* */
.youtube {position: relative; width: 100%; padding-top: 56.25%;}
.youtube iframe {position: absolute;top: 0;right: 0;width: 100% !important;height: 100% !important;}
/*----------------------------------------
webフォント（サーバー置き）
----------------------------------------*/
@font-face {
font-family: 'jp_sttl01'; /* お好きな名前にしましょう */
src: url('../font/.eot'); /* IE9以上用 */
src: url('../font/bokutachi.eot?#iefix') format('embedded-opentype'), /* IE8以前用 */ url('../font/NotoSansCJKjp-Medium.woff') format('woff'), /* モダンブラウザ用 */ url('../font/NotoSansCJKjp-Medium.woff') format('woff'); /* iOS, Android用 *//* 念の為指定しておきます */
font-weight: normal; /* 念の為指定しておきます */
font-style: normal;
vertical-align: top;
margin: 0px;
padding: 0px;
}
.myWebFontClass {
font-family: 'jp_sttl01';
}
/*----------------------------------------
webフォント（サーバー置き）
----------------------------------------*/
/* Ten Coding
-------------------------------------*/
img{vertical-align: bottom;}
.nobd a:hover { text-decoration: none !important; }
a img:hover { -ms-filter: "alpha( opacity=80 )"; filter: alpha(opacity=80); opacity: 0.8; }
.noop a img:hover { -ms-filter: "alpha( opacity=100 )" !important; filter: alpha(opacity=100) !important; opacity: 1 !important; }
.sis-pic { text-align: center; }
.sis-pic img { max-width: 100% !important; height: auto !important; }
.ten { display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; }
.ori { -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.ten-ce { display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; }
.ten-txt-ce { display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; }
.ten-mce { display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; }
.ten-u { display: -webkit-box; display: -moz-box; display: -webkit-flexbox; display: -moz-flexbox; display: -ms-flexbox; display: -webkit-flex; display: -moz-flex; display: flex; -webkit-box-align: end; -moz-box-align: end; -ms-flex-align: end; -webkit-align-items: flex-end; -moz-align-items: flex-end; align-items: flex-end; }
.order { -webkit-box-ordinal-group: -1; -moz-box-ordinal-group: -1; -webkit-flex-order: -1; -moz-flex-order: -1; -webkit-order: -1; -moz-order: -1; order: -1; }
.ten-t {-webkit-box-direction:normal;-moz-box-direction:normal;-webkit-box-orient:vertical;-moz-box-orient:vertical;-webkit-flex-direction:column;-moz-flex-direction:column;flex-direction:column; }
.ten-ue{-webkit-box-align:start;-moz-box-align:start;-ms-flex-align:start;-webkit-align-items:flex-start;-moz-align-items:flex-start;align-items:flex-start;}
.ten-o { -webkit-box-ordinal-group: -1; -moz-box-ordinal-group: -1; -webkit-flex-order: -1; -moz-flex-order: -1; -webkit-order: -1; -moz-order: -1; order: -1; }
.ten-rt { display: -webkit-box; display: -moz-box; display: -webkit-flexbox; display: -moz-flexbox; display: -ms-flexbox; display: -webkit-flex; display: -moz-flex; display: flex; -webkit-box-direction: reverse; -moz-box-direction: reverse; -webkit-box-orient: vertical; -moz-box-orient: vertical; -webkit-flex-direction: column-reverse; -moz-flex-direction: column-reverse; flex-direction: column-reverse; }