﻿/* ここは重要！消してはダメ！！
 Theme Name:   SB Cube Type Child
 Template:     sb_cube_type
ここは重要！消してはダメ！！ */

/*reCAPTCHAマークを消す*/
.grecaptcha-badge { visibility: hidden; }

body { background:rgba(255,255,255,1); color:rgba(0,0,0,0.7); }
div.contents .container { max-width: 960px; }

[class^='outer-'] .wp-block-image,
[class*=' outer-'] .wp-block-image,
.img-padding {
padding: 30px 0;
}

p, ul, ol{ padding-bottom: 10px; }
.archive-border{ border-bottom:1px solid rgba(0,0,0,0.2); }

/*フォント*/

.carousel-caption, .family-serif { font-family: "Times New Roman", "游明朝", YuMincho,"ヒラギノ明朝 Pr6 W6","Hiragino Mincho Pro", "HGS明朝E","メイリオ", "ＭＳ Ｐ明朝","MS PMincho",Meiryo, serif; }
body, [class^='box-title-s-'], [class*=' box-title-s-'], .family-sans-serif { font-family: /*"Noto Sans JP",*//*"M PLUS Rounded 1c",*/ "Helvetica Neue",Helvetica,"游ゴシック体",YuGothic,"游ゴシック Medium","Yu Gothic Medium","游ゴシック","Yu Gothic","メイリオ",-apple-system,BlinkMacSystemFont,sans-serif !important; }

[class^='box-title-b-'], [class*=' box-title-b-'], .family-mont, [class^='page-'] h3, [class*=' page-'] h3 { font-family: 'Montserrat', sans-serif; font-weight: 700; }

/* ★★★個別装飾★★★ */

/*#news { display: none; }*/
.news_box { background: rgba(0,0,0,0.08);padding: 50px 0; margin: 0; }

article.wp-entry h2 { color: rgba(191,0,0,1); text-align: center; margin-bottom: 50px; }
article h2 small { color: rgba(0,0,0,0.6) !important; font-size: 55%; }
article p { line-height: 170%; }

/*固定ページ*/

[class^='page-'] h2:first-child ,
[class*=' page-'] h2:first-child ,
[class^='page-'] h3:first-child ,
[class*=' page-'] h3:first-child ,
[class^='page-'] h4:first-child ,
[class*=' page-'] h4:first-child ,
[class^='page-'] h5:first-child ,
[class*=' page-'] h5:first-child ,
[class^='page-'] h6:first-child ,
[class*=' page-'] h6:first-child ,
[class^='page-'] p:first-child ,
[class*=' page-'] p:first-child ,
[class^='page-'] ul:first-child ,
[class*=' page-'] ul:first-child ,
[class^='page-'] ol:first-child ,
[class*=' page-'] ol:first-child {
margin-top: 0px !important;
}

[class^='page-'] h2,
[class*=' page-'] h2 {
text-align: center;
margin: 80px 0 60px;
}

[class^='page-'] h3,
[class*=' page-'] h3 {
position: relative;
display: block;
margin: 80px 0 100px;
font-size: 180%;
line-height: 150%;
text-align: center;
}

[class^='page-'] h3::before,
[class*=' page-'] h3::before {
content: '';
position: absolute;
bottom: -30px;
display: block;
width: 60px;
height: 3px;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
background-color: rgba(191,0,0,1);
border-radius: 2px;
}

[class^='page-'] h4,
[class*=' page-'] h4 {
position: relative;
padding-bottom: 0.3em;
border-bottom: 4px solid rgba(0,0,0,0.1);
margin: 70px 0 40px;
color: rgba(0,0,0,1);
font-size: 160%;
}

[class^='page-'] h4::after,
[class*=' page-'] h4::after {
position: absolute;
bottom: -4px;
left: 0;
z-index: 2;
content: '';
width: 15%;
height: 4px;
background-color: rgba(191,0,0,1);
}

[class^='page-'] h5,
[class*=' page-'] h5 {
position: relative;
padding: .75em 1em .75em 1.5em;
background: rgba(0,0,0,0.06);
color: rgba(0,0,0,1);
margin: 50px 0 30px;
}

[class^='page-'] h5::after,
[class*=' page-'] h5::after {
position: absolute;
top: .5em;
left: .5em;
content: '';
width: 6px;
height: -webkit-calc(100% - 1em);
height: calc(100% - 1em);
background-color: rgba(191,0,0,1);
border-radius: 4px;
}

[class^='page-'] h6,
[class*=' page-'] h6 {
position: relative;
padding: 0 .5em 0 1em;
margin:25px 0 15px;
line-height: 150%;
}

[class^='page-'] h6::before,
[class*=' page-'] h6::before {
position: absolute;
content: '';
border-radius: 20%
}

[class^='page-'] h6::before,
[class*=' page-'] h6::before {
top: 0.4em;
left: 0em;
z-index: 2;
width: 14px;
height: 14px;
background: rgba(191,0,0,0.8);
}

[class^='page-'] p,
[class*=' page-'] p {
margin:0 0 0px;
line-height: 150%;
}

[class^='page-'] ul,
[class*=' page-'] ul,
[class^='page-'] ol,
[class*=' page-'] ol
{
margin:0 0 10px 20px;
line-height: 170%;
}

ul.checkbox { padding-left: 0px !important; margin-left: 10px; }
ul.checkbox li { list-style-type: none !important; }
ul.checkbox li:before { content: "\2611"; }


/*投稿*/
[class^='outer-'] h3,
[class*=' outer-'] h3 {
border-bottom: 1px dotted rgba(191,0,0,1);
margin:10px 0 40px;
padding-bottom:5px;
line-height: 150%;
}

[class^='outer-'] h4,
[class*=' outer-'] h4 {
border-bottom: 1px dotted rgba(0,0,0,0.4);
margin:40px 0 30px;
padding-bottom:5px;
line-height: 150%;
}

[class^='outer-'] h5,
[class*=' outer-'] h5 {
font-weight: 600;
margin:30px 0 20px;
line-height: 150%;
}

[class^='outer-'] h6,
[class*=' outer-'] h6 {
text-decoration: underline dotted rgba(0,0,0,0.4);
margin:25px 0 15px;
line-height: 150%;
}

/* ★★★個別装飾★★★ */

/*リンクカラー*/

a:link, a:visited { color:rgba(191,0,0,1); }
a:hover { color:rgba(84,204,222,0.7); }
footer a { color:rgba(255,255,255,1) !important; }
/*ボタン*/
a.op-btn{ display:block;width:100%; padding:10px; text-align:center; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border:1px solid rgba(255,255,255,1)}
a:link .op-btn, a:visited .op-btn { background:rgba(191,0,0,1); color:rgba(255,255,255,1); }
a:hover .op-btn { background:rgba(191,0,0,0.7); color:rgba(255,255,255,1); }

/*グローバルナビ*/

#head-nav { position: absolute; z-index: 10000; top: 0vh; width: 100%; height: 13vh; background: rgba(255,255,255,0);}
h1, .icon-box { height: 13vh; display: table-cell; vertical-align: middle; }
h1 img { max-height: 7vh; max-width: 100%; margin-left:2vw; }
.navbar-toggle { margin-top:5vh !important; margin-right: 2vw;}

/*メニュー*/
#navi_list { position: absolute; z-index: 1000; top: 0; right: 0; background-color: rgba(255,127,0,0); }
.header-navi-ul { background: rgba(191,0,0,0.9); }

.icon-bar { background: rgba(0,0,0,1); }
button.active .icon-bar { background: rgba(255,255,255,1); }
.icon-text-open { color: rgba(0,0,0,1) }
.icon-text-close { color: rgba(255,255,255,1) }

/*メニューリンクカラー*/
.header-navi-ul li a { color: rgba(255,255,255,1);  }
.header-navi-ul li a:hover { background: rgba(191,0,0,0.92); }

/*メインイメージ ホーム*/

#main-image { position: absolute; z-index:-1; top: 0vh; width: 100%; height: 80vh; /*background: rgba(255,127,0,1);*/ }
#main-image .item { /*opacity: 0.7;*/  }
#main-image .item img { width: 100%; height: 80vh; margin: 0 auto; padding: 0 0 0; opacity: 0.4; }
#main-image .item img {
object-fit: cover;
object-position: center center;
font-family: 'object-fit: cover; object-position: center center;'}
@media screen and (max-width: 991px) {
#main-image .item img { padding:0; }
}
@media screen and (max-width: 767px) {
#main-image .item img { padding:0; }
}

/*メインイメージ サブ*/

#main-image-sub { position:absolute; z-index:-1; top: 13vh; width: 100%; height: 10vh; background: rgba(191,0,0,1); }
#main-image-sub .item { opacity: 0; }
#main-image-sub .item img { width: 100%; height: 10vh; margin: 0 auto; padding: 0 0 0; }
#main-image-sub .item img {
object-fit: cover;
object-position: center center;
font-family: 'object-fit: cover; object-position: center center;'}
@media screen and (max-width: 991px) {
#main-image-sub .item img { padding:0; }
}
@media screen and (max-width: 767px) {
#main-image-sub .item img { padding:0; }
}


/*コンテンツ部分*/

article { position: absolute; z-index: 100; width: 100%; top: 31vh; }
article.home { top: 45vh; }
@media screen and (max-width: 991px) {
}
@media screen and (max-width: 767px) {
}

/*フッタ*/
footer{ margin-top: 8vh; min-height: 50vh; background:rgba(191,0,0,1); color:rgba(255,255,255,1); font-size: 14px; }
footer li, footer ol { list-style-type: none; }
#copyright{ font-size: 60%; text-align: center; width: 100%; padding: 30px 0; color: rgba(0,0,0,0.7); background: rgba(255,255,255,1)}
@media screen and (max-width: 767px) {
#copyright{ font-size: 60%; }
}

/*ボックス表現*/

.home-box{ background:rgba(0,0,0,0); padding: 0; margin: 30px auto; max-width: 1440px; }

.home-box-outer{
float: left;
position: relative;
min-height: 1px;
overflow: hidden;
margin-left: 2%;
margin-right: 2%;
}

.box-large, .box-wlarge, .box-middle, .box-small{
display: flex; /* 子要素をflexboxで揃える */
flex-direction: column; /* 子要素をflexboxにより縦方向に揃える */
justify-content: center; /* 子要素をflexboxにより中央に配置する */
align-items: center;  /* 子要素をflexboxにより中央に配置する */
}

.home-box-bg{
position: absolute;

width:100%;
height:100%;
background-position:center center;
background-size: cover;
webkit-background-size: cover;
-moz-background-size: cover;
-ms-background-size: cover;

transition: all 0.5s ease-out;
transform: matrix3d(
1, 0, 0, 0,
0, 1, 0, 0,
0, 0, 1, 0,
0, 0, 0, 1
);
will-change: transform;

display: inherit;
flex-direction: inherit;
justify-content: inherit;
align-items: inherit;
}

.home-box-bg:hover {
transform: matrix3d(
1, 0, 0, 0,
0, 1, 0, 0,
0, 0, 1, 0,
0, 0, 0, 0.9
);
}

.mask{ background:rgba(255,255,255,0.2);
width:100%;
height:100%;
display: inherit;
flex-direction: inherit;
justify-content: inherit;
align-items: inherit;
}

.mask-b:hover { background: rgba(0,0,0,0.4);}


.home-box a:link [class^='box-title-'],
.home-box a:visited [class^='box-title-'],
.home-box a:link [class*=' box-title-'],
.home-box a:visited [class*=' box-title-']
{ color: rgba(0,0,0,1); text-shadow: 0px 0px 4px rgba(255,255,255,1); }

.home-box a:hover [class^='box-title-'],
.home-box a:hover [class*=' box-title-']
{ color: rgba(255,255,255,1); text-shadow: 0px 0px 0px rgba(255,255,255,0); }

.box-title{
position: relative;
pointer-events: none;
display: inline-block;
padding: 10px 15px;
text-align: center;
/*text-shadow: 0px 0px 7px rgba(0,0,0,1);*/
/*
border-width:1px;
border-style:solid;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
*/
}

/*IE回避*/
@media all and (-ms-high-contrast: none) {
.home-box-bg{ position: static; }
.box-title{ width: 100%; position: absolute; z-index: 1; bottom: 0; left: 0; }
}

[class^='box-title-b-large-'], [class^='box-title-b-large-'] { font-size: 180%; margin-bottom:10px; }
.box-title-s-large { font-size: 120%; }

[class^='box-title-b-wlarge-'], [class^='box-title-b-wlarge-'] { font-size: 180%; margin-bottom:10px; }
.box-title-s-large { font-size: 120%; }

[class^='box-title-b-middle-'], [class^='box-title-b-middle-'] { font-size: 160%; margin-bottom:10px; }
.box-title-s-middle { font-size: 100%; }

[class^='box-title-b-small-'], [class^='box-title-b-small-'] { font-size: 140%; margin-bottom:10px; }
.box-title-s-small { font-size: 100%; }


.box-large{
width: 46%;
height: 45.9vh;
margin-bottom: 2vh;
}

.box-wlarge{
width: 71%;
height: 22vh;
margin-bottom: 2vh;
}

.box-middle{
width: 21%;
height: 22vh;
margin-bottom: 2vh;
}

.box-small{
width: 21%;
height: 10vh;
margin-bottom: 2vh;
}

/* col-xs- 767px 以下 */
@media screen
    and (max-width: 767px) {	
[class^='box-title-b-large-'], [class^='box-title-b-large-'], [class^='box-title-b-wlarge-'], [class^='box-title-b-wlarge-'], [class^='box-title-b-middle-'], [class^='box-title-b-middle-'], [class^='box-title-b-small-'], [class^='box-title-b-small-'] { font-size: 180%; margin-bottom:10px; }
.box-title-s-large, .box-title-s-wlarge, .box-title-s-middle, .box-title-s-small { font-size: 120%; }
.box-large{width: 95%; height: 40vh; }
.box-wlarge{width: 95%; height: 40vh; }
.box-middle{ width: 95%; height: 30vh; }
.box-small{ width: 95%; height: 15vh; }
}

/*トップに戻る*/

img.pagetop { opacity: 0.2; }
img.pagetop:hover { opacity: 0.5; }

/*ページネーション*/

table.pagination {
margin:30px auto 0;
}

.pagination span, .pagination a {
display:block;
float:left;
margin: 2px 10px 2px 0;
padding:4px 7px 3px 7px;
text-decoration:none;
width:auto;
color: rgba(0,0,0,0.7);
border:1px solid rgba(0,0,0,0.2);
}

.pagination a:hover{
color:#fff;
background: rgba(13,158,255,1);
}

.pagination .current{
padding:4px 7px 3px 7px;
background: rgba(13,158,255,1);
color:#fff;
}


/*カルーセル*/

.carousel a:link, .carousel a:visited { color:#fff; }

/*カルーセルのインジケーター指定*/

.carousel-control { display:none; }
.carousel-control.left, .carousel-control.right{ background-image:none; }
.carousel-indicators { display:none; }
.carousel-caption { top: 22.5vh !important; text-shadow: 0px 0px 4px rgba(255,255,255,1); color: rgba(0,0,0,1); font-size: 200%; font-weight: bold; line-height: 150%; }

/*カルーセルをフェードインアウトにする指定※コメントアウトで横スライド*/
.carousel-fade .carousel-inner .item {
transition-property: opacity;
transition-duration:3s;
}
.carousel-fade .carousel-inner .item,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
opacity: 0;
}
.carousel-fade .carousel-inner .active,
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
opacity: 1;
}
.carousel-fade .carousel-inner .next,
.carousel-fade .carousel-inner .prev,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
left: 0;
transform: translate3d(0, 0, 0);
}
.carousel-fade .carousel-control {
z-index: 1000000;
}
/*カルーセルをフェードインアウトにする指定※コメントアウトで横スライド*/


/*SWIPER設定*/

.swiper-button-prev, .swiper-button-next {width:50px;height:50px;background-size:50px 50px;top:45%; }
.swiper-button-prev {left:0; right:auto; background-image:url('/info/base/image/parts/prev.png'); }
.swiper-button-next {left:auto; right:0; background-image:url('/info/base/image/parts/next.png'); }

.swiper-pagination-bullet { background: #fff !important; opacity:1; width:11px; height:11px;}
.swiper-pagination-bullet-active { background: #000 !important;}

/*イメージマップ設定*/

img[usemap] { max-width: 100%; height: auto; }

/*スマホ以外の電話リンクを外す※IEは11以降*/	

@media screen and (min-width: 768px) {
	a[href^="tel:"] {	pointer-events: none; color:inherit; }
}

/*コンタクトフォーム7*/

div.inq-form{  }

div.inq-form dl{
display: table;
width: 100%;
border-collapse: collapse;
border-spacing: 1.5rem 0;
margin-bottom: 0;
}

div.inq-form dt{
display: table-cell;
font-weight: normal;
width: 25%;
background: #fff;
padding: 2rem;
border: 1px solid #e3e3e3;
}

div.inq-form dd{
display: table-cell;
vertical-align: middle;
padding: 2rem;
background: #fff;
border: 1px solid #e3e3e3;
}

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

div.inq-form dl{
display: block;
width: 100%;
border-collapse: collapse;
}

div.inq-form dt{
display: block;
width: 100%;
background: #e3e3e3;
padding: 1rem;
}

div.inq-form dd{
display: block;
padding: 1rem;
background: #fff;
border: none;
}
}


div.wpcf7, div.wpcf7 label { font-weight:normal; }

div.wpcf7 input[type="text"],
div.wpcf7 input[type="email"],
div.wpcf7 input[type="tel"],
div.wpcf7 textarea,
div.wpcf7 select { border:1px solid #ccc; padding:5px 5px; margin:0; width:100%; border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px; }

div.wpcf7 label { margin-right:10px; }

div.wpcf7 input[name="your-name"]{ width:40%; }
div.wpcf7 input[name="ruby"]{ width:40%; }
div.wpcf7 input[name="kisai-name"]{ width:40%; }
div.wpcf7 input[name="birthday-year"]{ width:10%; }
div.wpcf7 input[name="birthday-month"]{ width:10%; }
div.wpcf7 input[name="birthday-day"]{ width:10%; }
div.wpcf7 select[name="profession"]{ max-width:40%; }
div.wpcf7 input[name="tel"]{ width:30%; }
div.wpcf7 input[name="your-email"]{ width:35%; }
div.wpcf7 input[name="your-email_confirm"]{ width:35%; }
div.wpcf7 input[name="postal"]{ width:25%; margin-bottom:15px; }
div.wpcf7 input[name="address"]{ width:70%; }

@media screen and (max-width: 767px) {
div.wpcf7 input[name="your-name"]{ width:100%; }
div.wpcf7 input[name="ruby"]{ width:100%; }
div.wpcf7 input[name="kisai-name"]{ width:100%; }
div.wpcf7 input[name="birthday-year"]{ width:25%; }
div.wpcf7 input[name="birthday-month"]{ width:20%; }
div.wpcf7 input[name="birthday-day"]{ width:20%; }
div.wpcf7 select[name="profession"]{ max-width:100%; }
div.wpcf7 input[name="tel"]{ width:100%; }
div.wpcf7 input[name="your-email"]{ width:100%; }
div.wpcf7 input[name="your-email_confirm"]{ width:100%; }
div.wpcf7 input[name="postal"]{ width:50%; margin-bottom:10px; }
div.wpcf7 input[name="address"]{ width:100%; }
}

div.wpcf7 input[class$="-submit"] { display:block; padding:25px 50px; margin:10px auto 10px;  border:1px solid #ccc; background:#e5e5e5; font-weight:bold; border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px; }
div.wpcf7 input[class$="-submit"]:hover { filter: alpha(opacity=70); opacity: 0.7; }
div.wpcf7 input[type="submit"][disabled]{filter: alpha(opacity=50); opacity: 0.5;}

div.wpcf7 form.sent p, div.wpcf7 form.sent div.inq-form { display:none; }

div.wpcf7-mail-sent-ok { border: 2px solid #398f14; padding:20px; text-align:center; font-weight:bold; }
div.wpcf7-mail-sent-ng { border: 2px solid #ff0000; padding:20px; text-align:center; font-weight:bold; }
div.wpcf7-spam-blocked { border: 2px solid #ffa500; padding:20px; text-align:center; font-weight:bold; }
div.wpcf7-validation-errors { border: 2px solid #f7e700; padding:20px; text-align:center; font-weight:bold; }
