@charset "utf-8";

/* =Reset default browser CSS.
Based on work by Eric Meyer:http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {border:0;font-family:inherit;font-size:100%;font-style:inherit;font-weight:inherit;margin:0;outline:0;padding:0;vertical-align:baseline;}
:focus {outline:0;}

ol, ul {list-style:none;}
table {border-collapse:separate;border-spacing:0;}
caption, th, td {font-weight:normal;text-align:left;}
blockquote:before, blockquote:after,q:before, q:after {content:"";}
blockquote, q {quotes:"" "";}
a img {border:0;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block;}

body{
font:90%/1.8 "メイリオ","Meiryo",arial,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
-webkit-text-size-adjust:100%;
background:#fff;
overflow-x: hidden;
}

html{background:#fff;}


/* リンク設定
------------------------------------------------------------*/
a{
margin:0;
padding:0;
text-decoration:none;
vertical-align:baseline;
background:transparent;
font-size:100%;
color:#1111cc;
}

a:hover, a:active{
-webkit-transition:opacity 1s;
-moz-transition:opacity 1s;
-o-transition:opacity 1s;
text-decoration:underline;
}

a img:hover{
cursor:pointer;
filter:alpha(opacity=60);
-moz-opacity:0.6;
-khtml-opacity: 0.6;
opacity:0.6;
transition:opacity 0.3s ease-out;
}


/**** Clearfix ****/
nav .panel:after, nav#mainNav:after, .newsTitle:after, .post:after,#footer:after{content:""; display:table;clear:both;}
nav .panel,nav#mainNav,.newsTitle, .post,#footer{zoom:1;}


/* レイアウト
------------------------------------------------------------*/
#wrapper,
.inner{
margin:0 auto;
width:1040px;
}

#content{
width:100%;
padding:20px 0;
}


/* ヘッダー
*****************************************************/

#header{
display:inline-block;
vertical-align:bottom;
background:#fff;
width:25%;
}

#header h1{
padding:20px 6% 0;
font-size:0;
}

#header h1 img.logo{
	width:auto;
	height:40px;
}

.inner #header h1{
padding-left:0;
}

#header_top{
display:inline-block;
vertical-align:bottom;
background:#fff;
}

#header_top h1{
padding:20px 10% 0;
font-size:0;
}

#header_top h1 img.logo{
	width:auto;
	height:40px;
}

.inner #header_top h1{
padding-left:0;
}


/* タブメニュー
*****************************************************/
nav#sub-menu ul{
display:table;
margin:0 auto;
padding:0;
text-align:center;
}

nav#sub-menu ul li{
display:table-cell;
min-width:50px;
padding:0 10em;
border-bottom:3px solid #ccc;
}

nav#sub-menu ul a{
display:block;
width:100%;
text-decoration:none;
padding-bottom:5px;
color:#333;
}

nav#sub-menu ul li:hover{
border-bottom:3px solid #333;
}

nav#sub-menu ul li.now{
border-bottom:3px solid #ca151a;
}

nav#sub-menu ul li.now a{
color:#ca151a;
}

nav#sub-menu ul li.now:hover{
border-bottom:3px solid #ca151a;
}


/* トップページ　メイン画像
----------------------------------*/
#mainImg{
clear:both;
margin-top:8px;
line-height:0;
text-align:center;
z-index:0;
}


#mainImg a:hover img{opacity:.9;}


@media only screen and (max-width: 1024px) {
    #mainImg img {
        width: 100%;
        height: auto;
        margin-top: -35px;
    }
}

#mainImg img.pc{
	width: 1040px;
    height: 350px;
    clear:both;
	line-height:0;
	text-align:center;
	margin: 8px auto 0;
	z-index:0;
}
@media screen and (max-width: 767px) {
#mainImg img.pc{
	display: none!important;
	}
}

#mainImg img.sp{
	display: none;
}
@media screen and (max-width: 767px) {
#mainImg img.sp{
	display: block!important;
	width: 100%;
	}
}

.postWrap{
margin:0 0 20px 0;
padding:4px;
}

article.archive span{padding-left:10px;}


/* タイポグラフィ
*****************************************************/
h2.title{
clear:both;
margin:30px 0 60px;
font-size:140%;
text-align:center;
}

h2.title span{
padding:5px 0 8px 0;
border-bottom:5px solid #000;
}

.dateLabel{
margin:0 0 10px;
text-align:right;
font:italic 1em "Palatino Linotype", "Book Antiqua", Palatino, serif;
}

.post{position:static;}

	.post .contents{
	padding:0 15px;
	margin-bottom:30px;
	}

.post p{padding:0 15px 20px 15px;}

.post ul{margin:0 0 20px 10px;}

.post ul li{
margin:5px 0 0 15px;
list-style:disc;
}

.post ol{margin:0 0 10px 30px;}

.post ol li{list-style:decimal;}

.post h1, .post h2, .post h3, .post h4{clear:both;}

.post h1{
margin:20px 0 20px 0;
padding:10px 15px;
font-size:130%;
background:#eee;
}

.post h2{
margin:20px 0 20px 0;
padding:3px 20px;
font-size:120%;
font-weight:normal;
border-left:5px solid #000;
}

.post2 h2{
margin:20px 0 20px 0;
padding:3px 20px;
font-family: "Noto Sans JP", sans-serif;
font-size:23px;
font-weight:bold;
text-align: center;
}

@media screen and (max-width: 767px) {
.post2 h2{
	margin:0 0 20px 0;
	}
}


.post h3{
margin:20px 0 20px 0;
padding-bottom:10px;
font-size:110%;
font-weight:normal;
border-bottom:1px solid #dddddd;
}

.post h4{
margin:20px 0 20px 0;
padding-bottom:10px;
font-size:100%;
font-weight:bold;
}

.post blockquote {
clear:both;
padding:10px 0 10px 20px;
margin:10px 0 25px 10px;
border-left:5px solid #ccc;
}

.post table{
width:100%;
border:1px #ddd solid;
border-collapse:collapse;
border-spacing:0;
margin:0 0 20px;
}

.post table th{
text-align:center;
padding:15px 15px;
border:#dddddd solid;
border-width:0 0 1px 1px;
background:#f6f6f6;
white-space:nowrap;
}

.post table td{
padding:15px 15px;
border:1px #ddd solid;
border-width:0 0 1px 1px;
}

.post dt{font-weight:bold;}

.post dd{padding-bottom:10px;}

.post img{max-width:100%;height:auto;}

img.aligncenter{
display:block;
margin:5px auto 40px 0;
}

img.alignright{
margin:0 0 25px 25px;
float:right;
}

img.alignleft{
margin:0 25px 25px 0;
float:left;
}


/* GoogleMapエリア
*****************************************************/

#GoogleMapArea{
clear:both;
width:100%;
padding:0;
margin:0;
font-size:0;
}
	#GoogleMapArea iframe{
		-webkit-filter:grayscale(100%);
		-moz-filter:grayscale(100%);
		-ms-filter:grayscale(100%);
		-o-filter:grayscale(100%);
		filter:grayscale(100%);
		transition:0.8s 
	}
	#GoogleMapArea iframe:hover{
		-webkit-filter:grayscale(0%);
		-moz-filter:grayscale(0%);
		-ms-filter:grayscale(0%);
		-o-filter:grayscale(0%);
		filter:grayscale(0%);
		transition:0.8s 
	}


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

#footer{
clear:both;
padding:20px 20px 15px 20px;
background:#f7f7f7;
margin:0;
}

#footer .inner{
display:flex;
flex-direction:row;
justify-content:flex-end;
}

#footer .inner >:first-child {
	margin-right: auto;
}

#footer img.logo{
width:auto;
height:24px;
}

#footer ul{
justify-content:flex-end;
text-align:center;
color:#111;
vertical-align:middle;
}
@media screen and (max-width: 767px) {
  #footer ul {
    flex-wrap: wrap;
    gap: 0.6em;
    justify-content: center;
  }
}

#footer li{
display:inline;
text-indent:-1em;
margin-left:1em;
}
@media screen and (max-width: 767px) {
#footer li{
display:inline;
text-indent:-1em;
margin-left:0;
}
}

#footer li::before {
  content: '▶';
  display: inline-block;
  margin-right: 0.4em;
  color: #111;
  margin-left: 1em;
}

/* SP版：Company だけ2重表示にならないように、liのbeforeを消す */
@media screen and (max-width: 767px) {
  #footer li.company_sp::before {
    content: none;
	}
}

/* デフォルトでは隠す（PC） */
.sp_arrow {
  display: none;
}

/* SP時のみ表示・横並びに */
@media screen and (max-width: 767px) {
  .sp_arrow {
    display: inline-block;
    font-size: 14px; /* お好みで調整 */
    color: #111;
    margin-right: 0.2em;
    vertical-align: middle;
    margin-left: 15px;
  }
}

/* SP版：Company だけ2重表示にならないように、liのbeforeを消す */
@media screen and (max-width: 767px) {
  #footer li.company_sp2::before {
    content: none;
	}
}

/* デフォルトでは隠す（PC） */
.sp_arrow2 {
  display: none;
}

/* SP時のみ表示・横並びに */
@media screen and (max-width: 767px) {
  .sp_arrow2 {
    display: inline-block;
    font-size: 14px; /* お好みで調整 */
    color: #111;
    margin-right: 0.2em;
    vertical-align: middle;
    margin-left: 15px;
  }
}


/* スラッシュで区切るパターン */
/* #footer li:not(:nth-child(1)):before{
content:" / ";
} */

#footer li a{
color:#111;
}

#footer li a:hover{
color:#999;
}

.copyright{
clear:both;
padding:15px 20px 20px 20px;
text-align:center;
font-size:90%;
zoom:1;
color:#111;
}

.copyright a{
color:#111;
}
.copyright a:hover{
color:#999;
}


/* トップページ 画像バナー
------------------------------------------------------------*/
.thumbWrapTop{
clear:both;
width:100%;
margin:1%;
padding:0;
font-size:0;
}
.thumbWrapTop ul.thumb{
display:flex;
flex-direction:row;
flex-wrap:wrap;
}

.thumbWrapTop ul.thumb li{
float:left;
width:47%;
margin:1%;
background:none;
}

.thumbWrapTop ul.thumb li:first-child{
width:96%;
}

.thumbWrapTop ul.thumb li:last-child{
width:96%;
}

.thumbWrapTop ul.thumb li img{
width:100%;
}


/* 中ページ 画像付きバナー（横4つ）
------------------------------------------------------------*/

.thumbWrap{
width:100%;
background:#ff0000;
margin:20px 0;
padding:0;
}

.thumbWrap ul.thumb li{
float:left;
width:24%;
margin:0 1% 2% 0;
list-style:none;
}
	.thumbWrap ul.thumb li:last-child{
	margin-right:0;
	}

.thumbWrap img{
margin:0 0 8px 0;
}

ul.thumb h3{
margin:8px 0 0 0;
font-size:100%;
font-weight:bold;
text-align:center;
border:2px solid #000;
padding:0;
}

ul.thumb p{
margin:0;
padding:0;
}

ul.thumb h3 span{
display:block;
padding:8px;
color:#000;
}

ul.thumb h3 span:hover{
color:#999;
}


/* 中ページ パンくずリスト
------------------------------------------------------------*/
#Breadcrumb{
clear:both;
padding:8px 4px;
}

#Breadcrumb ul li{
display:inline;
list-style:none;
}

#Breadcrumb ul li:after{
  content:'>';
  padding:0 3px;
  color:#111;
}

#Breadcrumb ul li:last-child:after{
content:'';
}

#Breadcrumb a{
color:#111;
}

#Breadcrumb a:hover{
color:#999;
}


/* 中ページ その他スタイル
------------------------------------------------------------*/

ul.waku{
padding:0 15px 0;
margin-bottom:30px;
}

ul.waku li{
display:inline-block;
list-style:none;
padding:0.6em;
text-align:center;
width:448px;
background-color:#efefef;
border:2px solid #c0c0c0;
border-radius:25px;
margin:0 8px 8px;
}
	ul.waku li.left{
		margin-right:0;
	}
	ul.waku li.right{}
	ul.waku li.long{
		width:930px;
	}

div.waku{
margin:0 0 20px 0;
text-align:center;
}

div.waku p{
display:inline-block;
padding:15px;
border:1px dashed #c0c0c0;
border-radius:8px;
text-align:left;
}

div.waku01{
display:inline-block;
position:relative;
margin:1em auto 0;
padding:1em 4em 1em 1em;
background-color:#fff;
border:1px solid #ccc;
box-shadow:1px 1px 1px #acacac;
}
div.waku01::before{
position:absolute;
content:'';
top:-15px;
right:10px;
height:55px;
width:15px;
border:3px solid #555; /*クリップ色 */
background-color:none;
border-radius:12px;
box-shadow:1px 1px 2px #999;
transform:rotate(10deg);
z-index:1;
}
div.waku01::after{
position:absolute;
content:'';
top:0px;
width:10px; 
right:20px;
border:solid 5px #fff; /*背景色と同じ色にする*/
z-index:2;
}

ul.workflow{
padding:0;
margin:0;
}

ul.workflow li{
list-style:none;
border:4px solid #ccc;
border-radius:10px;
margin-bottom:35px;
padding:10px 18px;
position:relative;
}

ul.workflow li:after{
bottom:-44px;
color:#ccc;
content:"▼";
font-size:24px !important;
left:48%;
position:absolute;
}

ul.workflow li:last-child:after{
content:"";
}

ul.workflow li p.wf-title{
margin:4px 0 8px 0;
padding:0;
font-size:120%;
line-height:1.2em;
font-weight:bold;
}

ul.workflow li ul{
margin:0 0 0 10px;
}

ul.workflow li ul li{
margin:0 0 0 15px;
list-style:disc;
border:none;
padding:0;
position:static;
}

.wf-other{
padding:0 15px;
}

ul.check li{
list-style:none;
position:relative;
}

ul.check li::after{
display:block;
content:'';
position:absolute;
top:.5em;
left:-1em;
width:8px;
height:3px;
border-left:2px solid #ca151a;
border-bottom:2px solid #ca151a;
-webkit-transform:rotate(-45deg);
transform:rotate(-45deg);
}

table.def h3{
margin:15px 0 10px 0;
padding-bottom:0;
font-size:100%;
font-weight:bold;
border-bottom:1px solid #dddddd;
}
table.def h3:first-child{margin-top:0;}

table.def h4{
margin:10px 0 0 0;
padding-bottom:0;
font-size:100%;
font-weight:bold;
}

table.def ul{
margin:5px 0 5px 1em;
}

table.def ul li{
margin:0 0 0 1em;
list-style:disc;
}

table.def ul.note{
margin-left:1em;
}

table.def ul.note li{
list-style:none;
}

table.def ul.note li:before{
content:'※';
margin-left:-1em;
}


/* メール送信フォーム
------------------------------------------------------------*/

#Mailform form,
#Mailform .waku-form{
width:100%;
margin:0 auto;
padding:0;
}

#Mailform .waku-form{
margin-top: 30px;
border:1px solid #ccc;
border-radius:7px;
box-shadow:0 0 7px rgba( 0, 0, 0, 0.2 );
background:#fff;
}

#Mailform .waku-form dl{
width:90%;
margin:0 auto;
overflow:hidden;
}

#Mailform .waku-form dt{
clear:both;
width:30%;
float:left;
border-top:1px solid #ccc;
padding:15px 0;
text-align:right;
overflow:hidden;
font-weight:normal;
line-height:2.2;
}

#Mailform .waku-form dl dd{
width:65%;
float:right;
border-top:1px solid #ccc;
padding:15px 0 15px 5%;
text-align: left;
}

	#Mailform .lh-no dt,
	#Mailform .lh-no dd{
	line-height:1.4;
	padding:15px 0;
	}

#Mailform .waku-form dl dt:first-child,
#Mailform .waku-form dl dt:first-child+dd{
border:none;
}

#Mailform .waku-form dl dt span.required,
#Mailform .waku-form dl dt span.optional{
display:inline-block;
float:left;
color:#fff;
line-height:1;
padding:8px 9px;
border-radius:3px;
margin-right: 10px;
}

#Mailform .waku-form dl dt span.required{
background:#d9534f;
border:1px solid #d43f3a;
}

#Mailform .waku-form dl dt span.optional{
background:#337ab7;
border:1px solid #2e6da4;
}

#Mailform .footer-form{
text-align:center;
padding:30px 0;
}


/* フォーム
------------------------------------------------------------*/
input[type="text"], input[type="email"], textarea{
vertical-align:middle;
max-width:90%;
line-height:30px;
height:30px;
padding:1px 5px;
border:1px solid #d4d4d7;
border-radius:3px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
font-size:100%;
background:#fcfcfc;
}

textarea{
height:auto;
line-height:1.5;
}

input[type="submit"],input[type="reset"],input[type="button"]{
padding:5px 10px 7px;
background:#2872B7;
background:-moz-linear-gradient(top, #4692D7 0%, #2872B7 100%);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#4692D7), color-stop(100%,#2872B7));
background:-webkit-linear-gradient(top, #4692D7 0%,#2872B7 100%);
background:-o-linear-gradient(top, #4692D7 0%,#2872B7 100%);
background:-ms-linear-gradient(top, #4692D7 0%,#2872B7 100%);
background:linear-gradient(to bottom, #4692D7 0%,#2872B7 100%);
filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#4692D7', endColorstr='#2872B7',GradientType=0 );
border:0;
border-radius:3px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
line-height:1.5;
font-size:100%;
color:#fff;
}

input[type="submit"]:hover,input[type="reset"]:hover,input[type="button"]:hover{
cursor:pointer;
background:#d20005;
background:-moz-linear-gradient(top, #2872B7 0%, #4692D7 100%);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#2872B7), color-stop(100%,#4692D7));
background:-webkit-linear-gradient(top, #2872B7 0%,#4692D7 100%);
background:-o-linear-gradient(top, #2872B7 0%,#4692D7 100%);
background:-ms-linear-gradient(top, #2872B7 0%,#4692D7 100%);
background:linear-gradient(to bottom, #2872B7 0%,#4692D7 100%);
filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#2872B7', endColorstr='#4692D7',GradientType=0 );
}

*:first-child+html input[type="submit"]{padding:3px;}


/* メインメニュー　PC用
------------------------------------------------------------*/
@media only screen and (min-width:1025px){

.pc{display:block !important;}
.sp{display:none !important;}

#mainNav{
display:inline-block;
vertical-align:bottom;
}

nav div.panel{
display:block !important;
float:left;
}

a#menu{display:none;}

.top nav#mainNav{
clear:both;
position:absolute;
right: 20px;
top: 20px;
z-index:200;
background:#fff;
}

nav#mainNav{
clear:both;
position:relative;
z-index:200;
background:#fff;
}

nav#mainNav ul li{
float:left;
position:relative;
border-right:1px solid #eee;
}

nav#mainNav ul li:first-child{
border-left:1px solid #eee;
}

nav#mainNav ul li a{
display:block;
text-align:center;
color:#000;
height:32px;
line-height:32px;
padding:8px 28px 0;
}

nav#mainNav ul li a span,
nav#mainNav ul li a strong{
display:block;
font-family:'Merriweather',serif;
font-size:110%;
line-height:1.4;
}

nav#mainNav ul li a span{
font-size:70%;
}

nav#mainNav ul li.current-menu-item,
nav#mainNav ul li:hover,
nav#mainNav ul li.current-menu-parent{
background:#f6f6f6;
}

nav#mainNav ul ul{
width:160px;
}

nav#mainNav ul li ul{
display:none;
}

nav#mainNav ul li:hover ul{
display:block;
position:absolute;
top:50px;
left:0;
z-index:500;
}

nav#mainNav ul li li{
padding:0 0 0 10px;
margin:0;
float:none;
height:40px;
line-height:40px;
width:160px;
border:0;
background:#fff;
border-bottom:1px solid #eee;
}

nav#mainNav ul li li:first-child{
border-left:0;
}

nav#mainNav ul li li a{
width:100%;
height:40px;
padding:0;
line-height:40px;
font-size:95%;
text-align:left;
}

nav#mainNav ul li li.current-menu-item a{font-weight:bold;}

nav#mainNav ul li li:hover{
background:#f6f6f6;
}

nav#mainNav ul li:hover ul li:last-child{
border:0;
}

}


/* メインメニュー iPadサイズ（1024px）以下から
------------------------------------------------------------*/
@media only screen and (max-width:1024px){

.pc{display:block !important;}
.sp{display:none !important;}

#header{float:none;}
#mainNav{float:none;}

#mainNav .inner{width:100%;}
	
nav#mainNav{
clear:both;
width:100%;
margin:0 auto 20px;
padding:0;
border-top:1px solid #eee;
border-bottom:1px solid #eee;
}

nav#mainNav a.menu{
width:100%;
display:block;
height:50px;
line-height:50px;
text-align:left;
color:#000;
background:url(images/menuOpen.png) no-repeat 10px 13px;
}

nav#mainNav a#menu span{padding-left:35px;}

nav#mainNav a.menuOpen{
background:url(images/menuOpen.png) no-repeat 10px -29px;
border-bottom:1px solid #eee;
}

nav#mainNav a#menu:hover{cursor:pointer;}

nav#mainNav ul{margin:0 auto;padding:0;}
nav#mainNav ul ul{padding:0;}

nav#mainNav ul li{
float:none;
clear:both;
width:100%;
height:auto;
line-height:1.2;
}

nav#mainNav ul li a,
nav#mainNav ul li.current-menu-item li a{
display:block;
padding:15px;
text-align:left;
color:#000;
border-bottom:1px solid #eee;
}

nav#mainNav ul li a span{display:none;}
 
nav#mainNav ul li a:hover,
nav#mainNav ul li.current-menu-item > a,
nav#mainNav ul li a:active,
nav#mainNav ul li li.current-menu-item a,
nav#mainNav ul li.current-menu-item li a:hover,
nav#mainNav ul li.current-menu-item li a:active{
background:#f6f6f6;
}

nav#mainNav ul li li{
float:left;
border:0;
}

nav#mainNav ul li li a,
nav#mainNav ul li.current-menu-item li a,
nav#mainNav ul li li.current-menu-item a{
padding-left:30px;
font-size:90%;
}

nav#mainNav ul li li a,
nav#mainNav ul li.current-menu-item li a,
nav#mainNav ul li li.current-menu-item a{
padding-left:40px;
background:url(images/sub1.png) no-repeat 20px 18px;
}

nav#mainNav ul li li.current-menu-item a,
nav#mainNav ul li li a:hover,
nav#mainNav ul li.current-menu-item li a:hover{
background:#f6f6f6 url(images/sub1.png) no-repeat 20px -62px;
}
	
nav#mainNav ul li li:last-child a{
background:url(images/subLast.png) no-repeat 20px 20px;
}
nav#mainNav ul li li:last-child.current-menu-item a,
nav#mainNav ul li li:last-child a:hover,
nav#mainNav ul li.current-menu-item li:last-child a:hover{
background:#f6f6f6 url(images/subLast.png) no-repeat 20px -65px;
}

nav .panel{
float:none;
display:none;
width:100%;
position:relative;
right:0;
top:0;
z-index:1;
}

#header ul li a,
#header ul li a:hover{
background-position:0 50%;
}

#wrapper, #header, .inner{
width:100%;
max-width: 100%;
box-sizing: border-box;
}

#header h1, #header p{padding:5px 10px;}
#header h2{padding:20px 10px 0;}
#header ul{padding:20px 10px 40px;}
.inner #header{padding:5px 10px;}

#content{
clear:both;
width:95%;
float:none;
margin:0 auto;
padding:20px 0 10px;
}

ul.waku{
padding:0;
margin-left:0;
}

ul.waku li,
ul.waku li.left,
ul.waku li.right,
ul.waku li.long{
float:none;
width:95%;
margin-left:0;
}

}


/* 幅644px以下から ヘッダー等微調節
------------------------------------------------------------*/
@media only screen and (max-width:644px){

.pc{display:none !important;}
.sp{display:block !important;}

#header{text-align:center;}
#header h1,#header p,#header ul{float:none;}
#headerInfo{width:250px;margin:0 auto;}
#footer ul{text-align:left;padding:0;}
#footer .inner{display:block;}
.post p{padding:0 0 15px 0;}
.post .contents{padding:0;}

.thumbWrapTop ul.thumb li{
width:96%;
}

.thumbWrap ul.thumb li{
width:98%;
margin-bottom:30px;
}

.thumbWrap img{
width:100%;
height:auto;
}

ul.workflow li{
margin-bottom:35px;
padding:4px 8px;
}

ul.workflow li:after{
bottom:-44px;
font-size:24px !important;
left:48%;
position:absolute;
}

ul.workflow li p.wf-title{
margin:4px 0;
font-size:120%;
line-height:1.2em;
}

ul.workflow li ul{
margin:0 0 0 4px;
}

ul.workflow li ul li{
margin:0 0 0 15px;
}

.wf-other{
padding:0;
}


#Mailform form,
#Mailform .waku-form{
width:100%;
}

#Mailform .waku-form dl{
overflow:visible;
}

#Mailform .waku-form dl dt{
width:auto;
float:none;
text-align:left;
padding:10px 0 5px;
}

#Mailform .waku-form dl dd{
width:auto;
float:none;
border-top:none;
padding:0px 0 13px 0px;
text-align: left;
font-size: 13px;
}
}


/* フォント設定 ※重要なスタイルだから一番下に置いておく
------------------------------------------------------------*/

.mt0 {margin-top:0 !important;}
.mt05 {margin-top:5px !important;}
.mt10 {margin-top:10px !important;}
.mt20 {margin-top:20px !important;}
.mt30 {margin-top:30px !important;}
.mt40 {margin-top:40px !important;}
.mt50 {margin-top:50px !important;}

.mb0 {margin-bottom:0 !important;}
.mb10 {margin-bottom:10px !important;}
.mb20 {margin-bottom:20px !important;}
.mb30 {margin-bottom:30px !important;}
.mb40 {margin-bottom:40px !important;}
.mb50 {margin-bottom:50px !important;}

.ml0 {margin-left:0px !important;}
.ml10 {margin-left:10px !important;}
.ml20 {margin-left:20px !important;}
.ml30 {margin-left:30px !important;}

.mr0 {margin-right:0px !important;}
.mr10 {margin-right:10px !important;}
.mr20 {margin-right:20px !important;}
.mr30 {margin-right:30px !important;}

.pt0 {padding-top:0 !important;}
.pt10 {padding-top:10px !important;}
.pt20 {padding-top:20px !important;}
.pt30 {padding-top:30px !important;}

.pb0 {padding-bottom:0 !important;}
.pb10 {padding-bottom:10px !important;}
.pb20 {padding-bottom:20px !important;}
.pb30 {padding-bottom:30px !important;}

.pl0 {padding-left:0px !important;}
.pl10 {padding-left:10px !important;}
.pl20 {padding-left:20px !important;}
.pl30 {padding-left:30px !important;}

.pr0 {padding-right:0px !important;}
.pr10 {padding-right:10px !important;}
.pr20 {padding-right:20px !important;}
.pr30 {padding-right:30px !important;}

.tl {text-align:left !important;}
.tc {text-align:center !important;}
.tr {text-align:right !important;}

.red {color:#d9534f !important;}

.indent-1{padding-left:1em;text-indent:-1em;}
.caution{color:#ca151a;}

.msg{
color:#ca151a;
}

span.def{
display:inline-block;
}

span.small{
display:inline-block;
font-size:80%;
line-height:1.2em;
}


/* Signage
------------------------------------------------------------*/


/* Location
--------------------------------------------*/
.location_container{
	text-align: center;
}

img.location{
	height: 100px;
	margin: 40px 20px 25px;
}
@media screen and (max-width: 767px) {
img.location{
	height: 80px;
	margin: 20px 20px 0px;
	}
}

img.location2{
	height: 100px;
	margin: 40px 20px 25px;
}
@media screen and (max-width: 767px) {
img.location2{
	height: 55px;
	margin: 20px 0px 0px;
	}
}


img.sub_txt_p{
	height: 170px;
	margin-bottom: 20px;
}
@media screen and (max-width: 767px) {
img.sub_txt_p{
	height: auto;
	width: 100%;
	margin-bottom: 10px;
	}
}


.blk_text{
	background-color: #000;
	color: #FFF;
	padding: 0px 15px 3px;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 27px;
	font-weight: 500;
	margin-bottom: 20px;
	text-align: center;
}
@media screen and (max-width: 767px) {
.blk_text{
	font-size: 20px;
	padding: 5px 5px 8px;
	letter-spacing: -0.7px;
	line-height: 1.3;
	}
}


.yello_txt{
	color: #fffd00;
}

.txt_box{
	font-family: "Noto Sans JP", sans-serif;
	font-size: 21px;
	font-weight: 500;
	line-height: 2.2rem;
	margin-bottom: 45px;
}
@media screen and (max-width: 767px) {
.txt_box{
		font-size: 19px;
		line-height: 1.8rem;
		padding: 0 10px;
	}
}


span.pink_txt{
	color: #e61673;
}


.data_pic img{
	max-width: 700px;
	margin-bottom: 50px;
}
@media screen and (max-width: 767px) {
.data_pic img{
	max-width:100%;
	margin-bottom: 30px;
	}
}

.map-images-container {
  position: relative;
  width: 720px;
  margin: 0 auto;
  overflow: hidden;
}
@media screen and (max-width: 767px) {
.map-images-container {
  	max-width: 370px;
	}
}


.map-images-tab {
  position: relative;
  width: 100%;
  height: 362px;
}

.map-images-tab > div.map-images {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.5s ease-in-out;
}

.map-images-tab > div.map-images.active {
  z-index: 9999 !important;
  /* position: relative !important; ← これを削除 or コメントアウト */
  opacity: 1 !important;
  visibility: visible !important;
}

.map-images img {
  width: 100%;
  height: auto;
  display: block;
}

/* 共通の左右矢印 */
.map-prev,
.map-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  background: rgba(255, 255, 255, 0.8);
  border-radius: 50%;
  font-family: "Font Awesome 5 Free";
  font-weight: 700;
  font-size: 25px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #000;
  z-index: 10000;
  cursor: pointer;
}

/* 位置 */
.map-prev {
  left: 15px;
}
.map-next {
  right: 15px;
}

/* アイコン */
.map-prev::before {
  content: "\f104"; /* ← FontAwesome chevron-left */
  font-family: "Font Awesome 5 Free";
}
.map-next::before {
  content: "\f105"; /* → FontAwesome chevron-right */
  font-family: "Font Awesome 5 Free";
}

.map-container {
  position: relative; /* ★ これが必要！ */
  width: 720px;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
.map-container {
  max-width: 370px;
  }
}


.map-images-container {
  position: relative;
  width: 720px;
  margin: 0 auto;
  overflow: hidden;
}

.map-images-tab {
  position: relative;
  width: 100%;
  height: 362px;
}
@media screen and (max-width: 767px) {
.map-images-tab {
  height: 186.11px;
	}
}


.map-images-tab > div.map-images {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.5s ease-in-out;
}

.map-images-tab > div.map-images.active {
  z-index: 9999 !important;
  /* position: relative !important; ← これを削除 or コメントアウト */
  opacity: 1 !important;
  visibility: visible !important;
}

.map-images img {
  width: 100%;
  height: auto;
  display: block;
}

/* 共通の左右矢印 */
.map-prev,
.map-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  background: rgba(255, 255, 255, 0.8);
  border-radius: 50%;
  font-family: "Font Awesome 5 Free";
  font-weight: 700;
  font-size: 25px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #000;
  z-index: 10000;
  cursor: pointer;
}

/* 位置 */
.map-prev {
  left: 15px;
}
.map-next {
  right: 15px;
}

/* アイコン */
.map-prev::before {
  content: "\f104"; /* ← FontAwesome chevron-left */
  font-family: "Font Awesome 5 Free";
}
.map-next::before {
  content: "\f105"; /* → FontAwesome chevron-right */
  font-family: "Font Awesome 5 Free";
}

.map-container {
  position: relative;
  width: 720px;
  margin: 0 auto;
}

.camera-button {
  position: absolute;
  width: 30px;
  height: 30px;
  cursor: pointer;
  z-index: 10;
}

.camera-button.camera-active::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 40px;
  height: 40px;
  background: rgba(255, 44, 112, 0.5);
  border-radius: 50%;
  transform: translate(-50%, -50%);
  animation: pulse 1.2s ease-in-out infinite;
  pointer-events: none;
}
@media screen and (max-width: 767px) {
.camera-button.camera-active::before {
  content: '';
  width: 20px;
  height: 20px;
  }
}

@keyframes pulse {
  0% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
  }
  50% {
    transform: translate(-50%, -50%) scale(1.6);
    opacity: 0.3;
  }
  100% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
  }
}


/* PCサイズ */
#camera_01 {
  top: 140px;
  left: 277px;
}

/* SPサイズ */
@media screen and (max-width: 767px) {
  #camera_01 {
    top: 65px;
    left: 135px;
  }
}

/* PCサイズ */
#camera_02 {
  top: 298px;
  left: 474px;
}

/* SPサイズ */
@media screen and (max-width: 767px) {
  #camera_02 {
    top: 146px;
    left: 236px;
  }
}

/* PCサイズ */
#camera_03 {
	top: 37px;
    left: 435px;
}

/* SPサイズ */
@media screen and (max-width: 767px) {
  #camera_03 {
    top: 12px;
    left: 216px;
  }
}

/* PCサイズ */
#camera_04 {
	top: 129px;
    left: 350px;
}

/* SPサイズ */
@media screen and (max-width: 767px) {
  #camera_04 {
    top: 59px;
    left: 173px;
  }
}




@media screen and (max-width: 767px) {
.br_pc_only{
	display: none;
	}
}

/* Planning
--------------------------------------------*/
.planning_container{
	text-align: center;
	margin-top: 30px;
}


/* ======= PC表示：2カラムGrid ======= */
.points {
  display: grid;
  grid-template-columns: 1fr 1fr; /* 2カラム */
  grid-template-rows: auto auto;
  grid-template-areas:
    "point01 point03"
    "point02 point02";
  gap: 30px;
  max-width: 1000px;
  margin: 0 auto;
  padding: 40px 0;
  box-sizing: border-box;
  font-family: sans-serif;
}

/* 各ポイントに配置場所を指定 */
.point-item:nth-child(1) {
  grid-area: point01;
}
.point-item:nth-child(2) {
  grid-area: point02;
  margin-top: -200px;
}
@media screen and (max-width: 767px) {
.point-item:nth-child(2) {
	grid-area: point02;
	margin-top: 20px;
	}
}
.point-item:nth-child(3) {
  grid-area: point03;
}

/* ======= 各 point-item の見た目 ======= */
.point-item {
  display: flex;
  flex-direction: row;
  max-width: 500px;
  box-sizing: border-box;
}

/* POINTラベル（左） */
.point-num {
  color: #e6007e;
  font-size: 25px;
  text-align: center;
  min-width: 90px;
  line-height: 1.2;
  font-family: "Roboto", sans-serif !important;
  font-weight: 900 !important;
}

.point-num span {
  display: block;
  font-size: 64px;
  line-height: 1;
  font-family: "Roboto", sans-serif !important;
  font-weight: 900 !important;
}
@media screen and (max-width: 767px) {
.point-num span {
	font-size: 54px;
	}
}

/* テキスト部分（右） */
.point-content {
  margin-left: 10px;
  flex: 1;
}
.point-content h3 {
  font-size: 29px;
  color: #0050b1;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  margin: 38px 0 6px;
  text-align: left;
  letter-spacing: -0.02rem;
}
@media screen and (max-width: 767px) {
.point-content h3 {
	font-size: 21px;
	margin: 0;
	}
}

.point-content p {
	font-size: 17.5px;
	color: #333;
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 500;
	line-height: 1.6;
	margin: 0 0 15px;
	text-align: left;
}
@media screen and (max-width: 767px) {
.point-content p {
	font-size: 16px;
	}
}


/* ====== price-box 全体 ====== */
.price-box {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 20px;
}

/* 横並び：ラベル左＋価格右 */
.price-item {
  display: flex;
  align-items: stretch; /* 高さ揃える */
  overflow: hidden;
  background: none;
}

/* 左：ラベル */
.price-label {
  background-color: #0044a6;
  color: #fff;
  padding: 0 10px;
  font-weight: bold;
  font-size: 16px;
  min-width: 160px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 767px) {
.price-label {
	font-size: 15px;
	min-width: 80px;
	line-height: 1.3;
	}
}

.br_sp_only {
	display: none;
}
@media screen and (max-width: 767px) {
.br_sp_only {
	display: block;
	}
}

.price-value {
  background-color: #fff;
  color: #0044a6;
  font-size: 14px;
  line-height: 1.5;
  flex: 1;


  /* 横並び化！ */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end; /* 右寄せ */
}

.price-value .price-main {
  display: flex;
  align-items: baseline; /* 数字と単位をきれいに揃える */
  gap: 4px;
  font-weight: bold;
}

.price-value strong {
  font-size: 26px;
  display: inline;
}
@media screen and (max-width: 767px) {
.price-value strong {
	font-size: 20px;
	display: inline;
	}
}

.price-value .tax-note {
  font-size: 14px;
  margin-top: -2px;
  text-align: center;
  width: 100%;
}

p.price-note{
	font-size: 15.2px;
}
@media screen and (max-width: 767px) {
p.price-note{
	font-size: 15.2px;
	text-indent: -1em;
	padding-left: 1rem;
	line-height: 1.3;
	}
}


/* ======= スマホ対応（1カラム） ======= */
@media screen and (max-width: 767px) {
  .points {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }

  .point-item {
    max-width: 100%;
  }

  .point-num {
  	font-size: 21px;
    text-align: left;
    margin: 7px 0 10px 10px;
  }

  .point-content {
    margin-left: -10px;
  }
}

/* Pricing
--------------------------------------------*/
.pricing_container {
  text-align: center;
  margin-bottom: 30px;
}

.price_wrapper{
	margin-top: 30px;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap: wrap; /* スマホ対応にしたい場合 */
	gap: 30px;
}
@media screen and (max-width: 767px) {
.price_wrapper{
	gap: 10px;
	}
}

.txt_box2 {
	flex: 1 1 60%;
	max-width: 550px;
}

/* ========== 基本テーブルスタイル ========== */
table.monthly_fee {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 24px;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 14px;
  color: #1a1a1a;
  line-height: 1.8;
}

/* ========== th・td共通パディングと配置 ========== */
table.monthly_fee th {
  padding: 2px 16px;
  width: 120px;
  background-color: #1a1a1a;
  color: #fff;
  font-weight: 500;
  text-align: center;
  font-size: 21px;
  white-space: nowrap;
  min-height: 70px;
  vertical-align: middle;
}

table.monthly_fee td {
  padding: 5px 16px;
  font-size: 16px;
  font-weight: 600;
  vertical-align: middle;
  line-height: 1.3;
}
@media screen and (max-width: 767px) {
table.monthly_fee td {
	padding: 5px 0px 5px 15px;
	}
}

/* ========== 金額表示 ========== */
.getugaku .price-line {
  display: flex;
  align-items: baseline;
  gap: 6px;
  color: #e6007e;
  font-weight: bold;
  font-size: 25px;
}
@media screen and (max-width: 767px) {
.getugaku .price-line {
	font-size: 21px;
	}
}

.getugaku .price-line .zeinuki {
  font-size: 18px;
  color: #e6007e;
}
@media screen and (max-width: 767px) {
.getugaku .price-line .zeinuki {
	font-size: 16px;
	}
}

/* ========== 月額補足テキスト ========== */
.plan_txt_big {
  font-size: 16px;
  padding-top: 8px;
  color: #1a1a1a;
  font-weight: 600;
  text-indent: -1em;
}

/* ========== スペーサー行 ========== */
table.monthly_fee tr.spacer-row td {
  padding: 0 !important;
  height: 10px;
  border: none;
  background: none;
  font-size: 0;
  line-height: 0;
}

/* ========== 注意書き ========== */
.plan_txt {
  font-size: 15px;
  color: #444;
  line-height: 2;
  margin-top: 20px;
  text-indent: -1em;
}
@media screen and (max-width: 767px) {
.plan_txt {
	line-height: 1.5;
	margin-bottom: 10px;
	}
}

.plan_txt2 {
  font-size: 15px;
  color: #444;
  line-height: 2;
  text-indent: -1em;
}
@media screen and (max-width: 767px) {
.plan_txt2 {
	line-height: 1.5;
	margin-bottom: 10px;
	}
}

.plan_txt .pin2 {
  color: #e6007e;
  font-weight: bold;
}

/* ========== インデント用 ========== */
.indent {
  display: inline-block;
  width: 1.5em;
}

.map_campaign {
  flex: 1 1 35%;
}

.googlemap iframe {
  max-width: 100%;
  width: 100%;
  height: 475px;
  border: 0;
  display: block;
}

@media screen and (max-width: 767px) {
  .googlemap iframe {
    height: auto;
    aspect-ratio: 1 / 1; /* 正方形にしたい場合。比率調整可 */
  }
}

/* ========== キャンペーン ========== */
.campaign {
	background-color: #e6007e;
	color: #FFF;
	text-align: center;
	font-size: 25px;
	font-weight: 700;
	padding: 20px 10px;
	width: 435px;
	line-height: 1.5;
}
@media screen and (max-width: 767px) {
.campaign {
	font-size: 20px;
	width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
    padding: 10px;
  }
}

.limited{
	font-size: 21px;
	font-weight: 600;
}

span.yel2{
	color: #fffd00;
}

/* Process
--------------------------------------------*/
.process_container{
	text-align: center;
	margin-bottom: 70px;
}
@media screen and (max-width: 767px) {
.process_container{
	text-align: center;
	margin-bottom: 30px;
	}
}

.process_wrapper{
	margin-top: 20px;
}

.pc_img{
	display: block;
}
@media screen and (max-width: 767px) {
.pc_img{
	display: none;
	}
}

.sp_img{
	display: none;
}
@media screen and (max-width: 767px) {
.sp_img{
	display: block;
	width: 100%;
    max-width: 100%;
    overflow: hidden;
    box-sizing: border-box;
	}
}

img.pro_img01{
	height: 417px;
	margin: 0 5px;
}

img.pro_img01_sp{
	width: 100%;
	height: auto;
	display: block;
	max-width: 100%;
	box-sizing: border-box;
	padding: 5px;
}

img.pro_img02{
	height: 417px;
	margin: 0 5px;
}

img.pro_img02_sp{
	width: 100%;
	height: auto;
	display: block;
	max-width: 100%;
	box-sizing: border-box;
	padding: 5px;
}

/* Broadcasting
--------------------------------------------*/
.broadcast_container{
	text-align: center;
	margin-bottom: 40px;
}

.tit_img_pc{
	display: block;
}
@media screen and (max-width: 767px) {
.tit_img_pc{
	display: none;
	}
}

.tit_img_sp{
	display: none;
}
@media screen and (max-width: 767px) {
.tit_img_sp{
	display: block;
	padding: 0 10px;
	}
}

img.location3{
	display: block;
	width: 100%;
	height: auto;
	box-sizing: border-box; /* 念のため */
	padding: 0; /* ← これを0にする */
	margin: 20px 0;
}

.bro_subtxt{
	font-family: "Noto Sans JP", sans-serif;
    font-size: 21px;
    font-weight: 500;
    line-height: 2.2rem;
	margin-bottom: 70px;
}
@media screen and (max-width: 767px) {
.bro_subtxt{
    font-size: 19px;
    padding: 0 10px;
    padding-left: 20px;
    text-indent: -1em;
    line-height: 1.8rem;
    margin-bottom: 30px;
	}
}

.broadcast_wrapper{
	display: flex;
}
@media screen and (max-width: 767px) {
.broadcast_wrapper{
	display: block;
	}
}

.bro_txtbox{
	text-align: left;
	max-width: 33%;
	margin: 0 20px;
}
@media screen and (max-width: 767px) {
.bro_txtbox{
	max-width: 100%;
	margin: 0 10px;
	}
}


.bro_txtbox h3{
	color: #004098;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 23px;
	font-weight: bold;
	line-height: 1.2;
	margin-bottom: 10px;
}

.bro_txt{
	margin-bottom: 20px;
}

.bro_txtbox ol{
	margin-bottom: 20px;
	list-style: decimal;
	padding-left: 1rem;
}

.bro_txtbox ul{
	list-style: disc;
	padding-left: 1rem;
	letter-spacing: -0.2px;
	margin-bottom: 20px;
}

.tel_txtbox span{
	font-family: "Noto Sans JP", sans-serif;
	font-size: 23px;
	font-weight: bold;
	line-height: 1.2;
}

.contact_container{
	text-align: center;
	margin-bottom: 40px;
}

.information span.tel{
	font-family: "Hind", sans-serif !important;
	font-size: 30px;
	font-weight: bold;
	color: #e61673;
}

.information a:hover{
	text-decoration: none !important;
}

a.tel-link{
	font-family: "Hind", sans-serif !important;
	font-size: 66px;
	color: #e61673 !important;
}
@media screen and (max-width: 767px) {
a.tel-link{
	font-size: 46px;
	}
}

.time span{
	font-size: 16px;
	font-weight: 500;
	line-height: 1;
}
