/*
Theme Name: JET BEANS テーマver3.0
Theme URI: http://wwwjetbeans.com/
Author: JET BEANS Inc.
Author URI: http://wwwjetbeans.com/
Description: Wordpressオリジナルテーマファイルセット。
Version: 3.0
License: 
License URI: 
Tags: 
Text Domain: 有限会社JET BEANS
*/

@charset "UTF-8";

/*Googleフォント*/
@import url(https://fonts.googleapis.com/css?family=Roboto:300,400,500&display=swap);
/*font-family: 'Roboto', sans-serif;*/

/*サイズやバランスを欧文フォントにあわせた日本語フォント*/
/*https://github.com/ookamiinc/kinto*/
/*「font」ディレクトリに設置して参照*/

@font-face {
	font-family: 'Kinto Sans';
	font-style: normal;
	font-weight: 300;
	font-display: swap;
	src: url(../font/kinto-master/KintoSans/KintoSans-Light.woff2) format("woff2"), url(../font/kinto-master/KintoSans/KintoSans-Light.woff) format("woff"), url(../font/kinto-master/KintoSans/KintoSans-Light.ttf) format("truetype")
}

@font-face {
	font-family: 'Kinto Sans';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url(../font/kinto-master/KintoSans/KintoSans-Regular.woff2) format("woff2"), url(../font/kinto-master/KintoSans/KintoSans-Regular.woff) format("woff"), url(../font/kinto-master/KintoSans/KintoSans-Regular.ttf) format("truetype")
}

@font-face {
	font-family: 'Kinto Sans';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url(../font/kinto-master/KintoSans/KintoSans-Medium.woff2) format("woff2"), url(../font/kinto-master/KintoSans/KintoSans-Medium.woff) format("woff"), url(../font/kinto-master/KintoSans/KintoSans-Medium.ttf) format("truetype")
}

@font-face {
	font-family: 'Kinto Sans';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url(../font/kinto-master/KintoSans/KintoSans-Bold.woff2) format("woff2"), url(../font/kinto-master/KintoSans/KintoSans-Bold.woff) format("woff"), url(../font/kinto-master/KintoSans/KintoSans-Bold.ttf) format("truetype")
}


/*日本語に含まれる約物を半角にする「Yaku Han JP」*/
@import url(https://cdn.jsdelivr.net/npm/yakuhanjp@3.3.1/dist/css/yakuhanjp.min.css);



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-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	
	box-sizing: border-box;/*width:100%で､padding分をハミ出させないためのスタイル*/
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
-ms-box-sizing: border-box;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, nav, section { display: block; }

audio, canvas, video {
	display: inline-block;
	max-width: 100%;
}

html {
	font-family: sans-serif;
	overflow-y: scroll;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust:     100%;
	font-size: 62.5%;
	
	
}


body {
	position:relative;
	margin:0;
	padding:0;
	font-size: 1.65rem;
	line-height: 1.8;
	font-family: YakuHanJP,Roboto,"Kinto Sans","Helvetica Neue","Segoe UI",Helvetica,"游ゴシック体",YuGothic,"Yu Gothic M","游ゴシック Medium","Yu Gothic Medium","メイリオ",Meiryo,sans-serif;
	color : #333333; /*色指定*/
	margin-top: 0px;
	
}

.clearfix:after,
.pc_only_clearfix:after {
	content: ".";
	display: block;
	height: 0.1px;
	line-height: 0;
	clear: both;
	visibility: hidden;
}

/* ----------Hides from IE-mac \*/
* html .clearfix,
* html .pc_only_clearfix {
	height: 1%;
}

.clearfix,
.pc_only_clearfix {
	display: block;
}

/* ----------for IE 5.5-7---------- */
.clearfix,
.pc_only_clearfix {
	zoom: 100%;
}


a {
	color : #333333; /* 色指定 */
	text-decoration:none;
	outline : 0 ; /* text-indentを使用した際にFirefoxでリンク線が出ないようにする */
}
a:visited{ color:#555555;}
a:focus { outline: thin dotted; }
a:hover, a:active {
	text-decoration  : none; /*下線指定*/
	color : #ffbd00 !important; /*色指定*/
}

h1, h2, h3, h4, h5, h6 {
	clear: both;
	margin:0;
}

address {
	font-style: italic;
	margin-bottom: 24px;
}

abbr[title] { cursor: help; }

b, strong { font-weight: 600; }

cite, dfn, em, i { font-style: italic; }

mark, ins { text-decoration: none; }

p { text-align:left;
	color:#333333; }

code, kbd, tt, var, samp, pre {
	font-family: monospace, serif;
	font-size: 15px;
	-webkit-hyphens: none;
	-moz-hyphens:    none;
	-ms-hyphens:     none;
	hyphens:         none;
	line-height: 1.6;
}

pre {
	border:none;
	-webkit-box-sizing: border-box;
	-moz-box-sizing:    border-box;
	box-sizing:         border-box;
	margin-bottom: 24px;
	max-width: 100%;
	overflow: auto;
	padding: 12px;
	white-space: pre;
	white-space: pre-wrap;
	word-wrap: break-word;
}

blockquote,
q {
	-webkit-hyphens: none;
	-moz-hyphens:    none;
	-ms-hyphens:     none;
	hyphens:         none;
	quotes: none;
}

blockquote:before, blockquote:after, q:before,q:after {
	content: "";
	content: none;
}

blockquote {
	font-size:100%;
	font-style: italic;
	font-weight: 300;
	line-height: 1.6;
}

blockquote cite, blockquote small {
	font-size: 16px;
	font-weight: 400;
	line-height: 1.6;
}

blockquote em, blockquote i, blockquote cite { font-style: normal; }

blockquote strong,
blockquote b { font-weight: 400; }

small { font-size: smaller; }

big { font-size: 125%; }

sup, sub {
	font-size: 75%;
	height: 0;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup { bottom: 1ex; }

sub { top: .5ex; }

ul{ list-style-type:none; }
ol{
	list-style-type:none;
	margin-left:1.5em;
	text-indent:-1.5em;
	}

li > ul,
li > ol { margin: 0 0 0 0px; }

img {
	-ms-interpolation-mode: bicubic;
	border: 0;
	vertical-align: middle;
}
a:hover img{
	filter:alpha(opacity=80); /*IE*/
	-moz-opacity:0.80; /*FF*/
	opacity:0.80;
}

figure { margin: 0; }

fieldset {
	border: 1px solid #e7e7e7;
	margin: 0 0 24px;
	padding: 11px 12px 0;
}

legend { white-space: normal; }

button, input, select, textarea {
	-webkit-box-sizing: border-box;
	-moz-box-sizing:    border-box;
	box-sizing:         border-box;
}

button, input { line-height: normal; }

 /* Removing the inner shadow, rounded corners on iOS inputs */
input, textarea {background-image: -webkit-linear-gradient(hsla(0,0%,100%,0), hsla(0,0%,100%,0)); }

button, html input[type="button"], input[type="reset"], input[type="submit"] {
	-webkit-appearance: button;
	cursor: pointer;
}

button[disabled], input[disabled] { cursor: default; }

input[type="checkbox"],
input[type="radio"] { padding: 0; }

input[type="search"] {
	-webkit-appearance: textfield;
}

input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

textarea {
	overflow: auto;
	vertical-align: top;
}

table, th, td { border:none; }

table {
	font-size:100%;
	border-collapse:collapse;
	}

caption, th, td {
	font-size:100%;
	line-height:1.6;
	font-weight: normal;
}



/* -------------------- 

ローディング

-------------------- */

/*ローディング　画面全体*/
.loading_box{
	position: fixed;
	display: flex; /* 子要素をflexboxで揃える */
	flex-direction: column; /* 子要素をflexboxにより縦方向に揃える */
	justify-content: center; /* 子要素をflexboxにより中央に配置する */
	align-items: center;	/* 子要素をflexboxにより中央に配置する */
	height: 100vh;
	width: 100vw;
	top:0;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: #ffffff;
	z-index: 20000 !important;
}


.sk-fading-circle {
	margin: 100px auto;
	width: 40px;
	height: 40px;
	position: relative;
}

.sk-fading-circle .sk-circle {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
}

.sk-fading-circle .sk-circle:before {
	content: '';
	display: block;
	margin: 0 auto;
	width: 15%;
	height: 15%;
	background-color: #333;
	border-radius: 100%;
	-webkit-animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
			animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
}
.sk-fading-circle .sk-circle2 {
	-webkit-transform: rotate(30deg);
		-ms-transform: rotate(30deg);
			transform: rotate(30deg);
}
.sk-fading-circle .sk-circle3 {
	-webkit-transform: rotate(60deg);
		-ms-transform: rotate(60deg);
			transform: rotate(60deg);
}
.sk-fading-circle .sk-circle4 {
	-webkit-transform: rotate(90deg);
		-ms-transform: rotate(90deg);
			transform: rotate(90deg);
}
.sk-fading-circle .sk-circle5 {
	-webkit-transform: rotate(120deg);
		-ms-transform: rotate(120deg);
			transform: rotate(120deg);
}
.sk-fading-circle .sk-circle6 {
	-webkit-transform: rotate(150deg);
		-ms-transform: rotate(150deg);
			transform: rotate(150deg);
}
.sk-fading-circle .sk-circle7 {
	-webkit-transform: rotate(180deg);
		-ms-transform: rotate(180deg);
			transform: rotate(180deg);
}
.sk-fading-circle .sk-circle8 {
	-webkit-transform: rotate(210deg);
		-ms-transform: rotate(210deg);
			transform: rotate(210deg);
}
.sk-fading-circle .sk-circle9 {
	-webkit-transform: rotate(240deg);
		-ms-transform: rotate(240deg);
			transform: rotate(240deg);
}
.sk-fading-circle .sk-circle10 {
	-webkit-transform: rotate(270deg);
		-ms-transform: rotate(270deg);
			transform: rotate(270deg);
}
.sk-fading-circle .sk-circle11 {
	-webkit-transform: rotate(300deg);
		-ms-transform: rotate(300deg);
			transform: rotate(300deg); 
}
.sk-fading-circle .sk-circle12 {
	-webkit-transform: rotate(330deg);
		-ms-transform: rotate(330deg);
			transform: rotate(330deg); 
}
.sk-fading-circle .sk-circle2:before {
	-webkit-animation-delay: -1.1s;
			animation-delay: -1.1s; 
}
.sk-fading-circle .sk-circle3:before {
	-webkit-animation-delay: -1s;
			animation-delay: -1s; 
}
.sk-fading-circle .sk-circle4:before {
	-webkit-animation-delay: -0.9s;
			animation-delay: -0.9s; 
}
.sk-fading-circle .sk-circle5:before {
	-webkit-animation-delay: -0.8s;
			animation-delay: -0.8s; 
}
.sk-fading-circle .sk-circle6:before {
	-webkit-animation-delay: -0.7s;
			animation-delay: -0.7s; 
}
.sk-fading-circle .sk-circle7:before {
	-webkit-animation-delay: -0.6s;
			animation-delay: -0.6s; 
}
.sk-fading-circle .sk-circle8:before {
	-webkit-animation-delay: -0.5s;
			animation-delay: -0.5s; 
}
.sk-fading-circle .sk-circle9:before {
	-webkit-animation-delay: -0.4s;
			animation-delay: -0.4s;
}
.sk-fading-circle .sk-circle10:before {
	-webkit-animation-delay: -0.3s;
			animation-delay: -0.3s;
}
.sk-fading-circle .sk-circle11:before {
	-webkit-animation-delay: -0.2s;
			animation-delay: -0.2s;
}
.sk-fading-circle .sk-circle12:before {
	-webkit-animation-delay: -0.1s;
			animation-delay: -0.1s;
}

@-webkit-keyframes sk-circleFadeDelay {
	0%, 39%, 100% { opacity: 0; }
	40% { opacity: 1; }
}

@keyframes sk-circleFadeDelay {
	0%, 39%, 100% { opacity: 0; }
	40% { opacity: 1; } 
}



/*-------------------------------- 

ヘッダー指定

--------------------------------*/


/* --------------------- PC：メインロゴ --------------------- */

.site-title{
	display:block;
	position:fixed;
	top:0;
	left:0px;
	padding: 15px 20px 15px 15px;
	background-color: #ffffff;
	border-bottom: 1px solid #e7e7e7;
	border-right: 1px solid #e7e7e7;
	
	z-index: 9999;
}

.site-title a{
	display:block;
	position: relative;
	width:148px;
	height:28px;
	text-decoration:none;
	background:url(../img/logo_a.svg) no-repeat center center;
}

.site-title a b{
	display: none;
}

.frontpage .site-title a{
	pointer-events: none;
}



/* ----------
	
パンくず　section

---------- */

.topicpath_area {
	display: block;
	clear: both;
	width: 100%;
	margin-top: 120px;
	background-color: #ffffff;
}


/*パンくずをくくったdiv*/
.topicpath_outer{
	padding: 0px 0px 0px 0px;
	padding-left: 60px;
	padding-right: 60px;
}


/* ----------パンくずリスト全体の設定---------- */

div.topicpath {
	display: block;
	width: 100%;
	margin: 0px auto 0px auto;
	padding-left: 3rem;
	padding-right: 3rem;
	text-align: left;
	clear: both;

	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-ms-box-sizing: border-box;
}

/* ----------パンくずリストそのものの設定---------- */

div.topicpath ul {
	margin: 0;
	padding: 0px 0px 0px 0px;
	font-size: 1.2rem;
	text-align: left;
	overflow: hidden;
}

/* ----------リンクのないリスト（＝閲覧しているページ）---------- */
div.topicpath li {
	color: #A5A5A5;
	list-style-type: none;
	padding:0px 4px 0px 4px;
	float: left;
	line-height: none;
	
	background: none;
}



/* ----------リンクのあるリスト（＝上位のページ）---------- */
div.topicpath li a {
	margin-right: 1px;
	color: #A5A5A5;
	line-height: none;
	padding-top: 0px;
	text-decoration: underline;
	font-weight: normal;
}

div.topicpath li a:hover {
	color: #00C3F0;
}

div.topicpath li a:after {
	content:">";
	display: inline-block;
	margin-left: 1rem;
	margin-right: 0rem;
}

	



/*--------------------------------

メインメニュー設定

--------------------------------*/




/* -------------------------------- 

 レイアウト設定
 
-------------------------------- */

div#contents_all{
	padding-top: 80px;
	margin-bottom: 60px;
}



.frontpage div#contents_all{
	padding-top: 0px;
	margin-bottom: calc(28vh + 60px) !important;
}


div#contents_main{
	display: block;
	position: relative;
	max-width: 86vw;
	margin: 0 auto;
}




/* -------------------------------- 

 パララックス設定

-------------------------------- */

/*フェードイン及びちょっと上に移動*/
.fadeInUp {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:1s;
 -ms-animation-duration:1s;
 animation-duration:1s;
 -webkit-animation-name: fadeInUp;
 animation-name: fadeInUp;
 visibility: visible !important;
 opacity: 0;
}

@keyframes fadeInUp {
	0% { opacity: 0;
		-webkit-transform: translateY(20px);
		-ms-transform: translateY(20px);
		transform: translateY(20px);
		}
	100% { opacity: 1;
		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		transform: translateY(0);
		}
}

/*--------------------*/

/*ディレイ（待機時間）※他のアニメーションとの併用*/
.delay_05 {animation-delay: 0.5s;}
.delay_1 {animation-delay: 1.0s;}
.delay_15 {animation-delay: 1.5s;}
.delay_2 {animation-delay: 2.0s;}
.delay_25 {animation-delay: 2.5s;}
.delay_3 {animation-delay: 3.0s;}
.delay_35 {animation-delay: 3.5s;}
.delay_4 {animation-delay: 4.0s;}
.delay_45 {animation-delay: 4.5s;}
.delay_5 {animation-delay: 5.0s;}

.delay_10 {animation-delay: 10.0s;}




/*フェードイン（ぼかし無し）*/
.fadeIn {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:1s;
 -ms-animation-duration:1s;
 animation-duration:1s;
 -webkit-animation-name: fadeIn;
 animation-name: fadeIn;
 visibility: visible !important;
 opacity: 0;
}

@keyframes fadeIn {
	0% { opacity: 0;

		}
	100% { opacity: 1;

		}
}


/*--------------------*/

/*フェードイン（ぼかしあり）*/
.fadeInBlur {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:1s;
 -ms-animation-duration:1s;
 animation-duration:1s;
 -webkit-animation-name: fadeInBlur;
 animation-name: fadeInBlur;
 visibility: visible !important;
 opacity: 0;
}


@keyframes fadeInBlur {
	0% { opacity: 0;
		filter: blur(30px);
		-webkit-filter: blur(30px);
		}
	100% { opacity: 1;
		filter: blur(0px);
		-webkit-filter: blur(0px);
		}
}

/*フェードイン（ぼかしあり）3秒かけて遷移*/
.fadeInBlur_For3sec {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:3s;
 -ms-animation-duration:3s;
 animation-duration:3s;
 -webkit-animation-name: fadeInBlur_For3sec;
 animation-name: fadeInBlur_For3sec;
 visibility: visible !important;
 opacity: 0;
}


@keyframes fadeInBlur_For3sec {
	0% { opacity: 0;
		filter: blur(30px);
		-webkit-filter: blur(30px);
		}
	100% { opacity: 1;
		filter: blur(0px);
		-webkit-filter: blur(0px);
		}
}

/*--------------------*/


/*スライドシャッター（半透明の白で隠しておいてシャーッと開く）*/
.slideShutter {
	overflow: hidden;
	
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
	-webkit-animation-duration:1s;
	-ms-animation-duration:1s;
	animation-duration:1s;
	-webkit-animation-name: slideShutter_base;
	animation-name: slideShutter_base;
	visibility: visible !important;
	opacity: 1;
	z-index: 1;
}

@keyframes slideShutter_base {
	0% {
		opacity: 0;
		}
	100% {
		opacity: 1;	
		}
}

.slideShutter:after{
	content: "";
	display: block;
	position: absolute;
	top:0;
	right: 0;
	height: 100%;
	width: 100%;
	background-color: rgba(255,255,255,0.7);
		
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
	-webkit-animation-duration:1s;
	-ms-animation-duration:1s;
	animation-duration:1s;
	-webkit-animation-name: slideShutter_coverbg;
	animation-name: slideShutter_coverbg;
	visibility: visible !important;
	opacity: 1;
	z-index: 1;
}


@keyframes slideShutter_coverbg {
	0% {
		right: 0;
		}
	20% {
		right: 0;
		}
	90% {
		right: 100%;
		}
	100% {
		right: 100%;	
		}
}

/*--------------------*/





/*------------------------------

フッター

------------------------------*/

#footer{
	display: block;
	position:fixed;
	bottom: 0px;
	left: 0px;
	right: 0px;
	height: 50px;
	margin: 0 auto ;
	text-align:center;
	background-color: #ffffff;
	clear:both;
	
	z-index: 9999;
}

.footer_inner{
	display: flex; /* 子要素をflexboxで揃える */
    flex-direction: column; /* 子要素をflexboxにより縦方向に揃える */
    justify-content: center; /* 子要素をflexboxにより中央に配置する */
    align-items: center;  /* 子要素をflexboxにより中央に配置する */
	width: 100%;
	height: 50px;
	padding-left: 15px;
	padding-right: 15px;
}

.footer_inner p{
	display: block;
	width: 100%;
	vertical-align: middle;
	text-align: left;
	font-size: 1.2rem;
}

/* ----------ページTOPへボタン---------- */
#pagetop_wrapper {
	display: block;
	position: fixed;
	right: 0px;
	bottom: 0px;
	width: 50px;
	height: 50px;
	padding: 0;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.pagetop {
	display: table-cell;
	width: 100%;
	height: 50px;
}

.pagetop a {
	display: block;
	width: 50px;
	height: 50px;
	background:url(../img/pagetop.png) center center no-repeat;
	background-size: 50px 50px;
	background-color: rgba(0,0,0,0.1);
}

.pagetop a:hover {
	background-color: rgba(0,0,0,0.2);
}

.pagetop a span {
	display:none;
}






/*------------------------------

各パーツ設定

------------------------------*/

/*各段落のタイトル欄　div*/
.section_title_box{
	display: block;
	position: relative;
	padding-left: 3rem;
	padding-right: 3rem;
	margin-bottom: 4rem;
	
}

.section_title_box h1{
	font-size: 3.8rem;
	font-weight: 300;
}

.section_title_box h1 b{
	display: none;
}


/*文字を一文字ずつディレイで表示*/
.delay_text{
	
}

.text_delay_animation:nth-Child(1){
	-webkit-animation: text_SlideFadeDelay 0.4s ease-in-out;
			animation: text_SlideFadeDelay 0.4s ease-in-out;
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
}

.text_delay_animation:nth-Child(2){
	-webkit-animation: text_SlideFadeDelay 0.6s ease-in-out;
			animation: text_SlideFadeDelay 0.6s ease-in-out;
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
}

.text_delay_animation:nth-Child(3){
	-webkit-animation: text_SlideFadeDelay 0.8s ease-in-out;
			animation: text_SlideFadeDelay 0.8s ease-in-out;
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
}

.text_delay_animation:nth-Child(4){
	-webkit-animation: text_SlideFadeDelay 1.0s ease-in-out;
			animation: text_SlideFadeDelay 1.0s ease-in-out;
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
}

.text_delay_animation:nth-Child(5){
	-webkit-animation: text_SlideFadeDelay 1.2s ease-in-out;
			animation: text_SlideFadeDelay 1.2s ease-in-out;
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
}

.text_delay_animation:nth-Child(6){
	-webkit-animation: text_SlideFadeDelay 1.4s ease-in-out;
			animation: text_SlideFadeDelay 1.4s ease-in-out;
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
}

.text_delay_animation:nth-Child(7){
	-webkit-animation: text_SlideFadeDelay 1.6s ease-in-out;
			animation: text_SlideFadeDelay 1.6s ease-in-out;
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
}

.text_delay_animation:nth-Child(8){
	-webkit-animation: text_SlideFadeDelay 1.8s ease-in-out;
			animation: text_SlideFadeDelay 1.8s ease-in-out;
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
}

.text_delay_animation:nth-Child(9){
	-webkit-animation: text_SlideFadeDelay 2.0s ease-in-out;
			animation: text_SlideFadeDelay 2.0s ease-in-out;
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
}

.text_delay_animation:nth-Child(10){
	-webkit-animation: text_SlideFadeDelay 2.2s ease-in-out;
			animation: text_SlideFadeDelay 2.2s ease-in-out;
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
}




@-webkit-keyframes text_SlideFadeDelay {
	0% { opacity: 0; margin-left:-1rem; }
	100% { opacity: 1; margin-left:0rem; }
}

@keyframes stext_SlideFadeDelay {
	0% { opacity: 0; margin-left:-1rem; }
	100% { opacity: 1; margin-left:0rem; } 
}






.section_content_box{
	display: block;
	position: relative;
	padding-left: 3rem;
	padding-right: 3rem;
	padding-bottom: 3rem;
}



/* -------------------- H1 -------------------- */

h1{
	font-size: 2.4rem;
}



/* -------------------- H2 -------------------- */

h2{
	font-size: 2.0rem;
	margin-bottom: 2rem;
}


/* -------------------- H3 -------------------- */

h3{

}


/* -------------------- H4/H5/H6 見出し設定 -------------------- */

h4{
	font-weight:bold;
}

h5{
	font-weight:bold;
}

h6{
	font-weight:bold;
}

/* ---------- 記事のpノーマル ---------- */

/*コメントタグをpダグで入れる場合に使用（<p class="comment">コメント</p>）*/
p.comment {
	display: none;
}

/*右にfloatさせる　主にpタグに指定*/
.float_left{
	float: left;
	padding-right: 10px;
}

.float_none{
	float:none;
	margin-right: 0px;
}

/* ---------- 文字装飾いろいろ ---------- */

/*サイズアップ*/
.fs_100{font-size:100% !important;}
.fs_105{font-size:105% !important;}
.fs_110{font-size:110% !important;}
.fs_120{font-size:120% !important;}
.fs_130{font-size:130% !important;}
.fs_140{font-size:140% !important;}
.fs_150{font-size:150% !important;}
.fs_160{font-size:160% !important;}
.fs_170{font-size:170% !important;}
.fs_180{font-size:180% !important;}
.fs_190{font-size:190% !important;}
.fs_200{font-size:200% !important;}
.fs_210{font-size:210% !important;}
.fs_220{font-size:220% !important;}
.fs_230{font-size:230% !important;}
.fs_240{font-size:240% !important;}
.fs_250{font-size:250% !important;}
.fs_260{font-size:260% !important;}
.fs_270{font-size:270% !important;}
.fs_280{font-size:280% !important;}
.fs_290{font-size:290% !important;}
.fs_300{font-size:300% !important;}

/*サイズダウン*/
.fs_95{font-size:95%;}
.fs_90{font-size:90%;}
.fs_85{font-size:85%;}
.fs_80{font-size:80%;}
.fs_75{font-size:75%;}
.fs_70{font-size:70%;}
.fs_60{font-size:60%;}
.fs_50{font-size:50%;}
.fs_40{font-size:40%;}
.fs_30{font-size:30%;}
.fs_20{font-size:20%;}
.fs_10{font-size:10%;}

/*色*/
.fc_red{color:#de0000 !important}
.fc_blue{color:#018BCE !important}/*←ポイントカラー*/
.fc_blue2{color:#46aee4 !important}
.fc_emerald{color:#0084AF !important}
.fc_skyblue{color:#6699cc !important}
.fc_green{color:#17cd6b !important}/*009900*/
.fc_green2{color:#26A28E !important}
.fc_lightgreen,
.fc_litegreen{color:#99cc66 !important}
.fc_orange{color:#ffcc33 !important}
.fc_orange2{color:#E66000 !important}
.fc_purple{color:#663399 !important}
.fc_lightpurple,
.fc_litepurple{color:#cc99cc !important}
.fc_brown{color:#996633 !important}
.fc_gray{color:#999999 !important}
.fc_darkgray{color:#666666 !important}
.fc_white{color:#ffffff !important}



/*書体*/
/*明朝*/
.ff_sans-serif{
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

/*ゴシック*/
.ff_serif{
	font-family: YakuHanJP,Roboto,"Kinto Sans","Helvetica Neue","Segoe UI",Helvetica,"游ゴシック体",YuGothic,"Yu Gothic M","游ゴシック Medium","Yu Gothic Medium","メイリオ",Meiryo,sans-serif;
}

/*左右中央揃え　text-alignの略*/
.ta_center{text-align: center !important;}
.ta_left{text-align: left !important;}
.ta_right{text-align: right !important;}


/*フォントウェイト*/
.fw_100{font-weight: 100;}
.fw_200{font-weight: 200;}
.fw_300{font-weight: 300;}
.fw_400{font-weight: 400;}
.fw_500{font-weight: 500;}
.fw_600{font-weight: 600;}
.fw_700{font-weight: 700;}
.fw_800{font-weight: 800;}
.fw_900{font-weight: 900;}

.bold,
.strong{
	font-weight: bold;
}


/*背景色付の項目見出し　span*/
.item_red,
.item_blue,
.item_skyblue,
.item_emerald,
.item_green,
.item_lightgreen,
.item_litegreen,
.item_orange,
.item_purple,
.item_lightpurple,
.item_litepurple,
.item_brown,
.item_gray,
.item_darkgray,
.item_white,
.item_subject1,
.item_subject2,
.item_subject3,
.item_subject4{
	display: inline-block;
	text-align: center;
	vertical-align: text-top ;
	padding: 4px 4px 4px 4px;
	margin-top: 0px;
	line-height: 100% !important;
	background-color: #b7c833;
	letter-spacing: 0.05rem;
	min-width: 70px;
	margin-right: 10px;
	font-size: 1.1rem;
	color: #FFFFFF;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
}

/*上記と併用して利用。Sサイズ*/
.item_s{
	padding: 4px 4px 4px 4px;
	min-width: 70px;
	margin-right: 10px;
	font-size: 1.1rem;
	color: #FFFFFF;
}

/*上記と併用して利用。Mサイズ*/
.item_m{
	padding: 4px 4px 4px 4px;
	min-width: 95px;
	margin-top: -1px;
	margin-right: 10px;
	font-size: 1.3rem;
	color: #FFFFFF;
}

/*上記と併用して利用。Lサイズ*/
.item_l{
	padding: 6px 10px 6px 10px;
	min-width: 120px;
	margin-top: -4px;
	margin-right: 10px;
	font-size: 1.5rem;
	color: #FFFFFF;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
}

.item_red{
	background-color: #ff3333;
}

.item_blue{
	background-color: #018BCE;
}

.item_skyblue{
	background-color: #6699cc;
}

.item_emerald{
	background-color: #54CAC5;
}

.item_green{
	background-color: #00A077;
}

.item_lightgreen,
.item_litegreen{
	background-color: #99cc66;
}

.item_orange{
	background-color: #ffcc33;
}

.item_purple{
	background-color: #663399;
}

.item_lightpurple,
.item_litepurple{
	background-color: #cc99cc;
}

.item_brown{
	background-color: #996633;
}

.item_gray{
	background-color: #999999;
}

.item_darkgray{
	background-color: #666666;
}

.item_white{
	color: #333333;
	background-color: #ffffff;
	border: 1px solid #e7e7e7;
}


/*縦書きのキャッチコピー*/
.tategaki{
	display: inline-block;
	/*font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;*/
	text-align: left;
	
	line-height: 1.6;
	margin-top: 0rem;
	margin-bottom: 1.6rem;
	padding-left: 0px;
	background: none;
	
	-webkit-writing-mode: vertical-rl;
	    -ms-writing-mode: tb-rl;
	        writing-mode: vertical-rl;
}



/* ---------- 写真の配置設定 ---------- */

/*WPのメディアライブラリから挿入されたとき、自動的に挿入されるdivのclass*/
.wp-caption {
}

.wp-caption img {
	margin: 0;
	padding: 0;
	border: 0 none;
	
	max-width: 790px;
	height: auto;
}

/* ---------- 画像配置関連 キャプション付きの回し込み ---------- */

img{
	/*max-width: 790px;
	height: auto;*/
}


/*画像とキャプション両方を囲んだDIVのクラス設定：回り込み無し*/
.alignone{
	display: block;
	width: 100%!important;
	margin-bottom: 10px;
	clear: left;
}

/*画像とキャプション両方を囲んだDIVのクラス設定：中央揃え*/
.aligncenter {
	display: block;
	text-align: center;
	margin: 0 auto;
	margin-bottom: 10px;
	clear: left;
	float: none;
}

img.aligncenter {
	display: block;
	width:auto;
	text-align: center;
	margin:0 auto;
	margin-bottom: 10px;
	clear: left;
}

/* ----------写真を中央に配置---------- */
.aligncenter img {
	display: block;
	margin: 0 auto 0px auto!important;
	height: auto;
}


/*画像とキャプション両方を囲んだDIVのクラス設定：画像が右寄せになる場合*/
.alignright {
	text-align: right;
	float: right;
	padding-left: 20px;
	margin-bottom: 10px;
}

/*画像とキャプション両方を囲んだDIVのクラス設定：画像が左寄せになる場合*/
.alignleft {
	text-align: left;
	float: left;
	padding-right: 20px;
	margin-bottom: 10px;
}

/* ----------写真を左に配置---------- */
.alignleft img {
	height: auto;
	margin-bottom: 10px;
	float: none;
}

/* ----------写真を右側に配置---------- */
.alignright img {
	margin-bottom: 10px;
	float: none;
}

/*キャプションのスタイル（alignnone、alignleft、alignrightの場合）*/
.wp-caption-text,
.alignleft .wp-caption-text {
	display: block;
	text-align: left;
	font-size: 90%;
	line-height: 140%;
	color: #797979;
	clear: both;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}


.alignright .wp-caption-text {
	display: block;
	width: 100%;
	text-align: left;
	font-size: 90%;
	line-height: 140%;
	color: #797979;
	clear: both;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

/*キャプションのスタイル（aligncenterの場合）*/
.aligncenter .wp-caption-text{
	text-align: center;
	font-size: 90%;
	line-height: 140%;
	color: #797979;
	clear: both;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

/*imgにグレーの枠線*/
img.border_gray{
	border: #e7e7e7 solid 1px;
}


/*写真をトリミングして配置*/
/*JS「ofi.min.js」と併用*/
.fit {
	object-fit: cover;
	object-position: bottom;
	font-family: 'object-fit: cover; object-position: bottom;'
}


.trim {
	display: block;
	overflow: hidden;
	position: relative;
	width: 100%;
	padding-bottom: 75%;/*4:3*/
	margin-bottom: 10px;
}


.trim.w10per{
	width: 10%;
	padding-bottom: 7.5%;
}

.trim.w20per{
	width: 20%;
	padding-bottom: 15%;
}

.trim.w30per{
	width: 30%;
	padding-bottom: 22.5%;
}

.trim.w40per{
	width: 40%;
	padding-bottom: 30%;
}

.trim.w50per{
	width: 50%;
	padding-bottom: 37.5%;
}

.trim.w60per{
	width: 60%;
	padding-bottom: 45%;
}

.trim.w70per{
	width: 70%;
	padding-bottom: 52.5%;
}

.trim.w80per{
	width: 80%;
	padding-bottom: 60%;
}

.trim.w90per{
	width: 90%;
	padding-bottom: 67.5%;
}

.trim.w100per{
	width: 100%;
	padding-bottom: 75%;
}



.trim_wide {
	display: block;
	overflow: hidden;
	position: relative;
	width: 100%;
	padding-bottom: 56.625%;/*16:9*/
	margin-bottom: 10px;
}

.trim_wide.w10per{
	width: 10%;
	padding-bottom: 5.6625%;
}

.trim_wide.w20per{
	width: 20%;
	padding-bottom: 11.325%;
}

.trim_wide.w30per{
	width: 30%;
	padding-bottom: 17%;
}

.trim_wide.w40per{
	width: 40%;
	padding-bottom: 22.65%;
}

.trim_wide.w50per{
	width: 50%;
	padding-bottom: 28.3125%;
}

.trim_wide.w60per{
	width: 60%;
	padding-bottom: 33.975%;
}

.trim_wide.w70per{
	width: 70%;
	padding-bottom: 39.6375%;
}

.trim_wide.w80per{
	width: 80%;
	padding-bottom: 45.3%;
}

.trim_wide.w90per{
	width: 90%;
	padding-bottom: 50.9625%;
}

.trim_wide.w100per{
	width: 100%;
	padding-bottom: 56.625%;
}

/* 中央に合わせて、リサイズせずに、はみ出た分をトリミング(画像に対するCSS) */
.trim img,
.trim_wide img {
	position: absolute;
	width: 100%;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

.alignleft.trim img,
.alignleft.trim_wide img {
	width: 98%;
	width : -webkit-calc(100% - 20px) ;
	width : calc(100% - 20px) ;
	left: 49%;
	left : -webkit-calc(50% - 10px) ;
	left : calc(50% - 10px) ;
}

.alignright.trim img,
.alignright.trim_wide img {
	width: 98%;
	width : -webkit-calc(100% - 20px) ;
	width : calc(100% - 20px) ;
	left: 49%;
	left : -webkit-calc(50% + 10px) ;
	left : calc(50% + 10px) ;
}

.alignleft.trim.w100 img,
.alignleft.trim_wide.w100 img,
.alignright.trim.w100 img,
.alignright.trim_wide.w100 img {
	position: absolute;
	width: 100%;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

/* 右寄せで写真を縦に並べるカラム状のボックス */

.photo_column_right{
	float:right;
	margin-left:30px;
}


/*alignleft、alignright等と併記して、横幅を%可変にする*/
.w10per{width: 10% !important;}
.w20per{width: 20% !important;}
.w30per{width: 30% !important;}
.w40per{width: 40% !important;}
.w50per{width: 50% !important;}
.w60per{width: 60% !important;}
.w70per{width: 70% !important;}
.w80per{width: 80% !important;}
.w90per{width: 90% !important;}
.w100per{width: 100% !important;}
.w110per{width: 110% !important;}
.w120per{width: 120% !important;}

.w10per img,
.w20per img,
.w30per img,
.w40per img,
.w50per img,
.w60per img,
.w70per img,
.w80per img,
.w90per img,
.w100per img,
.w110per img,
.w120per img{
	width: 100%;
	max-width: 100%;
	height: auto;
}

/*横幅ピクセル指定*/
.w10px{width: 10px !important;}
.w20px{width: 20px !important;}
.w30px{width: 30px !important;}
.w40px{width: 40px !important;}
.w50px{width: 50px !important;}
.w60px{width: 60px !important;}
.w70px{width: 70px !important;}
.w80px{width: 80px !important;}
.w90px{width: 90px !important;}
.w100px{width: 100px !important;}
.w110px{width: 110px !important;}
.w120px{width: 120px !important;}
.w130px{width: 130px !important;}
.w140px{width: 140px !important;}
.w150px{width: 150px !important;}
.w160px{width: 160px !important;}
.w170px{width: 170px !important;}
.w180px{width: 180px !important;}
.w190px{width: 190px !important;}
.w200px{width: 200px !important;}

/*スマホ用横幅ピクセル指定*/
.sp_w10px{width: 10px !important;}
.sp_w20px{width: 20px !important;}
.sp_w30px{width: 30px !important;}
.sp_w40px{width: 40px !important;}
.sp_w50px{width: 50px !important;}
.sp_w60px{width: 60px !important;}
.sp_w70px{width: 70px !important;}
.sp_w80px{width: 80px !important;}
.sp_w90px{width: 90px !important;}
.sp_w100px{width: 100px !important;}
.sp_w110px{width: 110px !important;}
.sp_w120px{width: 120px !important;}
.sp_w130px{width: 130px !important;}
.sp_w140px{width: 140px !important;}
.sp_w150px{width: 150px !important;}
.sp_w160px{width: 160px !important;}
.sp_w170px{width: 170px !important;}
.sp_w180px{width: 180px !important;}
.sp_w190px{width: 190px !important;}
.sp_w200px{width: 200px !important;}

.w10px img,
.w20px img,
.w30px img,
.w40px img,
.w50px img,
.w60px img,
.w70px img,
.w80px img,
.w90px img,
.w100px img,
.w110px img,
.w120px img,
.w130px img,
.w140px img,
.w150px img,
.w160px img,
.w170px img,
.w180px img,
.w190px img,
.w200px img,
.sp_w10px img,
.sp_w20px img,
.sp_w30px img,
.sp_w40px img,
.sp_w50px img,
.sp_w60px img,
.sp_w70px img,
.sp_w80px img,
.sp_w90px img,
.sp_w100px img,
.sp_w110px img,
.sp_w120px img,
.sp_w130px img,
.sp_w140px img,
.sp_w150px img,
.sp_w160px img,
.sp_w170px img,
.sp_w180px img,
.sp_w190px img,
.sp_w200px img{
	width: 100%;
	max-width: 100%;
	height: auto;
}


/* ---------- 記事内のテーブル設定 ---------- */

table {
	margin-bottom: 0.5rem;
	border-top: #e7e7e7 solid 1px;
	border-left: #e7e7e7 solid 1px;
	width: 100%;
	font-size: 96%;
}

table.table_90per {
	width: 90% !important;
}

table.table_80per {
	width: 80% !important;
}

table.table_70per {
	width: 70% !important;
}

table.table_60per {
	width: 60% !important;
}

table.table_50per {
	width: 50% !important;
}

table.table_40per {
	width: 40% !important;
}

table.table_30per {
	width: 30% !important;
}

table.table_20per {
	width: 20% !important;
}

table.table_10per {
	width: 10% !important;
}

tr {
	border-bottom: #e7e7e7 solid 1px;
	border-right: #e7e7e7 solid 1px;
}

th {
	padding: 4px 8px 4px 8px;
	/*background-color: #EDEDE9;*//*ベージュ*/
	/*background-color: rgba(151, 217, 239, 0.3);*//*薄いブルー*/
	background-color: rgba(84,202,197, 1.0);/*エメラルドグリーン*/
	/*white-space: nowrap;*/
	border-bottom: #e7e7e7 solid 1px;
	border-right: #e7e7e7 solid 1px;
	font-weight: normal !important;
	color: #ffffff;
}

table.noline,
table.noline tr,
table.noline td,
table.noline th{
	border: 0px !important;
}



.sub_td_bg {
	background-color: rgba(84,202,197, 0.2) ;
}

.sub_td_bg_gray {
	background-color: #EDEDE9;
}

.sub_td_bg_white {
	background-color: #ffffff;
}


td {
	padding: 4px 8px 4px 8px;
	border-bottom: #e7e7e7 solid 1px;
	border-right: #e7e7e7 solid 1px;
}

table.border-print td {
}

table.table_2column {
	margin-bottom: 0.5rem;
	border-top: #e7e7e7 solid 1px;
	border-left: #e7e7e7 solid 1px;
	width: 49%;
	float: left;
	margin-right: 1%;
}

table.table_4column {
	margin-bottom: 0.5rem;
	border-top: #e7e7e7 solid 1px;
	border-left: #e7e7e7 solid 1px;
	width: 24%;
	float: left;
	margin-right: 1%;
}


/*スマホレスポンシブ対応のテーブル*/
table.sp_responsive_table {
}

table.sp_responsive_table .sp_only {
	display: none;
}

/*改行させない*/
.nowrap,
table tr.nowrap,
table tr th.nowrap,
table tr td.nowrap,
p.nowrap,
span.nowrap{
	white-space: nowrap !important;
}

/*横並びの画像をスマホでも横並びのまま表示するtable　のstyle*/
table.table_img_2column,
table.table_img_2column tr {
	max-width: 1140px !important;
}

table.table_img_2column,
table.table_img_2column tr,
table.table_img_2column th,
table.table_img_2column td {
	border: 0px;
	border: none;
	padding: 0px 0px 0px 0px;
}

table.table_img_2column td:first-child {
	padding: 0px 10px 0px 0px;
}

table.table_img_2column td:last-child {
	padding: 0px 0px 0px 10px;
}

table.table_img_2column img{
	width: 100% !important;
	height: auto;
}


/*tableタグにこのclassが指定されているtableの中に入れ子になっているtableから罫線を取る*/
/*学科の教育科目のtableなど*/
.td_in_table td table,
.td_in_table td table th,
.td_in_table td table tr,
.td_in_table td table td{
	border: none !important;
	padding: 0px;
}

.td_in_table td table{
	margin-bottom: 0rem;
	width: auto !important;
}

.td_in_table td table td{
	margin-bottom: 0rem;
	width: 230px !important;
}

.td_in_table td table .td_bg_color_blue{
	background-color: #d8e1f1;
}


/*tdの上だけ、borderを太くする*/
table .border_top_3px{
	border-top: #e7e7e7 solid 3px !important;
}



/*一番上の項目行を左の列に可変テーブル（「no_responsive_table」と併記）*/
.td_change_table{
	width: 100%;
	border-top: #DBD8CC solid 1px;
	border-left: #DBD8CC solid 1px;
	margin-bottom: 10px !important;
}

table.td_change_table.w_auto{
	width: auto;
}

table.td_change_table tr {
	font-size:96% !important;
	line-height:150% !important;
	background-color: #ffffff;
}

table.td_change_table th {
	padding:4px 10px 4px 10px !important;
	font-size:96% !important;
	line-height:150% !important;
	white-space:nowrap !important;
	
	border-bottom: #DBD8CC solid 1px;
	border-right: #DBD8CC solid 1px;
	background-color: #C5C2B1;
	
	color: #ffffff;
	font-weight: 600;
}

table.td_change_table td {
	padding:10px 10px 10px 10px !important;
	font-size:96% !important;
	line-height:130% !important;
	
	border-bottom: #DBD8CC solid 1px;
	border-right: #DBD8CC solid 1px;

}

table.td_change_table td p {
	line-height:130% !important;
}




/* -------------------- 水平線画像 -------------------- */

hr{
	display:block;
	width:100%;
	height:1px;
	margin-top: 3rem;
	margin-bottom: 3rem;
	border:none;
	border:0;
	background:#e7e7e7;
	clear:both;
	float:none;
}

hr.hr_white{
	display:block;
	width:100%;
	height:1px;
	margin-top: 3rem;
	margin-bottom: 3rem;
	border:none;
	border:0;
	background:#ffffff;
	clear:both;
	float:none;
}

hr.hr_dot{
	display:block;
	width:100%;
	height:1px;
	margin-top: 3rem;
	margin-bottom: 3rem;
	border:none;
	border-top:dotted 1px #e7e7e7;
	color:#ffffff;
	background:#ffffff;
	clear:both;
	float:none;
}



/* ---------- 記事内のグレー罫線の囲み（div） ---------- */

.box_gray{
	padding:20px 25px 20px 25px;
	margin:10px 0px 25px 0px;
	border: solid 1px #d2d2d2;
}

.box_blue{
	padding:20px 25px 20px 25px;
	margin:10px 0px 25px 0px;
	border: solid 1px #018BCE;
}

.box_emerald{
	padding:20px 25px 20px 25px;
	margin:10px 0px 25px 0px;
	border: solid 1px #00BDC2;
}

.box_white{
	padding:20px 25px 20px 25px;
	margin:10px 0px 25px 0px;
	border: solid 0px #d2d2d2;
	background-color: #ffffff;
}

.box_gray_compact {
	padding:15px 15px 15px 15px;
	margin:10px 0px 25px 0px;
	border: solid 1px #d2d2d2;
	line-height: 150%;
}

.box_blue_compact {
	padding:15px 15px 15px 15px;
	margin:10px 0px 25px 0px;
	border: solid 1px #018BCE;
	line-height: 150%;
}

.box_white_compact {
	padding:15px 15px 15px 15px;
	margin:10px 0px 25px 0px;
	border: solid 0px #d2d2d2;
	line-height: 150%;
}

.box_gray5 {
	padding:20px 25px 20px 25px;
	margin:10px 0px 25px 0px;
	border: solid 5px #d2d2d2;
}

.box_blue5 {
	padding:20px 25px 20px 25px;
	margin:10px 0px 25px 0px;
	border: solid 5px #018BCE;
}

.box_blue3 {
	padding:20px 25px 20px 25px;
	margin:10px 0px 25px 0px;
	border: solid 3px #018BCE;
}

.box_gray10 {
	padding:20px 25px 20px 25px;
	margin:10px 0px 25px 0px;
	border: solid 10px #d2d2d2;
}

.box_blue10 {
	padding:20px 25px 20px 25px;
	margin:10px 0px 25px 0px;
	border: solid 10px #018BCE;
}


.box_gray_beige5 {
	padding:20px 25px 20px 25px;
	margin:10px 0px 25px 0px;
	border: solid 5px #F3EFE9;
}

/*お問い合わせ先フォーマット（「box_gray_beige5」と同じ）*/
.contact_info_box {
	padding:20px 25px 20px 25px;
	margin:10px 0px 25px 0px;
	border: solid 5px #F3EFE9;
}



/* 背景が薄いグレーのボックス */
.box_bg_gray{
	background-color:#f6f6f6;
	padding:20px 25px 20px 25px;
	margin:10px 0px 25px 0px;
}

/* 背景が薄いベージュのボックス */
.box_bg_beige{
	background-color:#F3EFE9;
	padding:20px 25px 20px 25px;
	margin:10px 0px 25px 0px;
}

/* 背景が白のボックス */
.box_bg_white{
	background-color:#ffffff;
	padding:20px 25px 20px 25px;
	margin:10px 0px 25px 0px;
}

/*「box_XX」と併記して利用　角丸*/
.r2{
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
}

.r3{
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}

.r4{
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
}

.r5{
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}


/*「box_gray_XX」と併記して利用*/

/*inline-blockを追加する*/
.display_ib{
	overflow: hidden;
	display: inline-block;
}

.display_ib_va{
	overflow: hidden;
	display: inline-block;
	vertical-align: top;
}

/*スマホではblock*/
.sp_display_b{
	/*display: block;*/
}

/*テキストインデントを0にする*/
.no_indent{
	text-indent: 0px;
}



/* ---------- 記事内のol ---------- */

ol {
	margin-left: 0rem !important;
	padding-left: 2.6rem;
	padding-bottom: 8px;
	list-style-type: decimal;
}

ol > li {
	padding: 2px 0px 6px 0rem;
	text-indent: 0rem;
}

ol > li > ul {
	list-style:none;
	background: none;
	padding: 0px 0px 0px 2.3rem;
	margin-left: -2.3rem;
}

ol > li > ul li {
	text-indent: 0rem;
	padding: 2px 0px 4px 2px;
	padding-left:22px;
	background-image:url(../img/icon_32_disc_black.png) ;
	background-size: 16px 16px;
	background-repeat:no-repeat;
	background-position:0 5px;
}


/* ---------- 記事内のul ---------- */


ul {
	list-style:none;
	background: none;
	padding: 0px 0px 0px 0px;
	letter-spacing: -.40em;
}

ul li{
	padding: 2px 0px 4px 2px;
	padding-left:22px;
	background-image:url(../img/icon_32_disc_black.png) ;
	background-size: 16px 16px;
	background-repeat:no-repeat;
	background-position:0 6px;
	letter-spacing: normal;
}

ul.disc li {
	padding: 2px 0px 4px 2px;
	padding-left:22px !important;
	text-indent: 0rem !important;
	background-image:url(../img/icon_32_disc_black.png) !important;
	background-size: 16px 16px!important;
	background-repeat:no-repeat !important;
	background-position:0 6px!important;
}


ul.list_inline5 li {
	display: inline-block;
	width: 20%;
}

/*画面幅940px未満*/
@media (max-width: 940px) {
	ul.list_inline5 li {
		width: 25%;
	}
}

/*画面幅414px未満*/
@media (max-width: 414px) {
	ul.list_inline5 li {
		width: 100%;
	}
}


ul li:before{	
}

 ul.float{
	float: none;
	clear: both;
}

 ul.float li {
	display: inline-block;
	padding: 2px 10px 4px 0px;
	float: left;
	background:none;
}


/*先頭のディスクを付けない場合、ulにこのclassを指定「no_disc」*/
ul.no_disc {
	list-style:none;
	background: none;
	padding: 0px 0px 0px 0px;
	margin-bottom: 10px;
}

ul.no_disc li {
	padding: 2px 0px 4px 2px;
	padding-left:2rem;
	background:none !important;
	background-repeat:no-repeat;
	background-position:0 5px;
	font-size: 96%;
}

ul.no_disc li ul li {
	padding: 2px 0px 4px 2px;
	padding-left:2rem;
}

/* ---------- 記事内のア、イ、ウ…のliのul ---------- */

.list_50on,
ul li .list_50on {
	margin-left: 0 !important;
	padding-left: 0 !important;
	list-style:none !important;
	background: none !important;
}

.list_50on li,
 ul li .list_50on li {
	padding-left: 1rem !important;
	text-indent: -1rem !important;
	list-style:none !important;
	background: none !important;
}


/* ---------- ulを○文字分で揃えるのliのul ---------- */

.list_1em,
ul li .list_1em,
.list_1rem,
ul li .list_1rem {
	margin-left: 0 !important;
	padding-left: 0 !important;
	list-style:none !important;
	background: none !important;
}

span.list_1em,
.list_1em li,
 ul li .list_1em li,
 span.list_1rem,
.list_1rem li,
 ul li .list_1rem li {
	padding-left: 1.0rem !important;
	text-indent: -1.0rem !important;
	list-style:none !important;
	background: none !important;
}

.list_1_5em,
ul li .list_1_5em,
.list_1_5rem,
ul li .list_1_5rem {
	margin-left: 0 !important;
	padding-left: 0 !important;
	list-style:none !important;
	background: none !important;
}

span.list_1_5em,
.list_1_5em li,
 ul li .list_1_5em li,
 span.list_1_5rem,
.list_1_5rem li,
 ul li .list_1_5rem li {
	padding-left: 1.5rem !important;
	text-indent: -1.5rem !important;
	list-style:none !important;
	background: none !important;
}

.list_2em,
ul li .list_2em,
.list_2rem,
ul li .list_2rem {
	margin-left: 0 !important;
	padding-left: 0 !important;
	list-style:none !important;
	background: none !important;
}

span.list_2em,
.list_2em li,
 ul li .list_2em li,
 span.list_2rem,
.list_2rem li,
 ul li .list_2rem li {
	padding-left: 2.0rem !important;
	text-indent: -2.0rem !important;
	list-style:none !important;
	background: none !important;
}


.list_2_5em,
ul li .list_2_5em,
.list_2_5rem,
ul li .list_2_5rem {
	margin-left: 0 !important;
	padding-left: 0 !important;
	list-style:none !important;
	background: none !important;
}

span.list_2_5em,
.list_2_5em li,
 ul li .list_2_5em li,
 span.list_2_5rem,
.list_2_5rem li,
 ul li .list_2_5rem li {
	padding-left: 2.5rem !important;
	text-indent: -2.5rem !important;
	list-style:none !important;
	background: none !important;
}

.list_3em,
ul li .list_3em,
.list_3rem,
ul li .list_3rem {
	margin-left: 0 !important;
	padding-left: 0 !important;
	list-style:none !important;
	background: none !important;
}

span.list_3em,
.list_3em li,
 ul li .list_3em li,
 span.list_3rem,
.list_3rem li,
 ul li .list_3rem li {
	padding-left: 3.0rem !important;
	text-indent: -3.0rem !important;
	list-style:none !important;
	background: none !important;
}

.list_4em,
ul li .list_4em,
.list_4rem,
ul li .list_4rem {
	margin-left: 0 !important;
	padding-left: 0 !important;
	list-style:none !important;
	background: none !important;
}

span.list_4em,
.list_4em li,
 ul li .list_4em li,
 span.list_4rem,
.list_4rem li,
 ul li .list_4rem li {
	padding-left: 4.0rem !important;
	text-indent: -4.0rem !important;
	list-style:none !important;
	background: none !important;
}


/* ---------- 記事内の注釈 ---------- */

.annotate {
	/*padding: 6px 0px 6px 0px;*/
	font-size: 90%;
	color: #666;
}

.indent_1em,
.indent_1rem{
	padding-left: 1.0rem !important;
	text-indent: -1.0rem !important;
}

.indent_1_5em,
.indent_1_5rem{
	padding-left: 1.5rem !important;
	text-indent: -1.5rem !important;
}



/* ---------- div内で2列にならべるdiv ---------- */

/*2列全体　div*/
.text_box_2column{
	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-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap;
	overflow: hidden;
	position: relative;
}

.text_box_2column_left,/*左*/
.text_box_2column_right,/*右*/
.text_box_2column .column_inner{
	display: inline-block;
	position: relative;
	overflow: hidden;
	position: relative;
	width: 48%;
	margin-right: 4%;
}

.text_box_2column_right,
.text_box_2column .column_inner:nth-child(2n){
	margin-right: 0%;
}

/* ---------- div内で3列にならべるdiv ---------- */

/*3列全体　div*/
.text_box_3column{
	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-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap;
	overflow: hidden;
	position: relative;
}

.text_box_3column_left,/*左*/
.text_box_3column_center,/*中央*/
.text_box_3column_right,/*右*/
.text_box_3column .column_inner{
	display: inline-block;
	position: relative;
	overflow: hidden;
	position: relative;
	width: 30%;
	margin-right: 5%;
	float: left;
}

.text_box_3column_right,
.text_box_3column .column_inner:nth-child(3n){
	margin-right: 0%;
}

.text_box_3column_left img,
.text_box_3column_center img,
.text_box_3column_right img,
.text_box_3column .column_inner img{
	width: 100%;
	height: auto;
}



/* ---------- div内で4列にならべるdiv ---------- */

/*4列全体　div*/
.text_box_4column{
	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-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap;
	overflow: hidden;
	position: relative;
}

.text_box_4column_1,/*左*/
.text_box_4column_2,/*中央*/
.text_box_4column_3,/*中央*/
.text_box_4column_4,/*右*/
.text_box_4column .column_inner{
	display: inline-block;
	position: relative;
	overflow: hidden;
	position: relative;
	width: 22%;
	margin-right: 4%;
}

.text_box_4column_4,
.text_box_4column .column_inner:nth-child(4n){
	margin-right: 0%;
}

.text_box_4column_1 img,
.text_box_4column_2 img,
.text_box_4column_3 img,
.text_box_4column_4 img,
.text_box_4column .column_inner img{
	width: 100%;
	height: auto;
}


/*box_grayを併用した場合の調整*/
.column_inner.box_gray,
.box_gray.column_inner{
	margin-top: 0px;
}

/* ----------リンクとダウンロードファイルのアイコン---------- */
/*aタグ用*/

/*基本リンク*/
.link {
	/*color: #403D3C;*/
	margin: 6px 0px 6px 0px;
	padding: 0px 0px 0px 18px;
	min-height: 24px;
	background: url(../img/icon_32_link.png) no-repeat left center;
	background-size: 16px 16px;
}

.link:hover {	
	background: url(../img/icon_32_link.png) no-repeat left center;
	background-size: 16px 16px;
}

/*基本ボタン（白背景、黒フチ）*/
.button{
	display: inline-block;
	position: relative;
	text-align: center;
	font-size: 1.5rem;
	color: #494645 !important;
	background-color: transparent !important;

	border: solid 1px #494645 !important;
	padding: 4px 2rem 4px 2rem;
	
	min-width: 110px;
	
	text-decoration: none;
	margin-top: 6px;	
	margin-bottom: 6px;
	margin-left: 3px;
	
	border-radius: 100px;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

.button:hover{
	display: inline-block;
	position: relative;
	text-align: center;
	color: #ffffff !important;

	background: -moz-linear-gradient(left, #5FB7B4, #02B1D6);
	background: -webkit-linear-gradient(left, #5FB7B4, #02B1D6);
	background: linear-gradient(to right, #5FB7B4, #02B1D6);
	
	border: solid 1px transparent !important;
	padding: 4px 2rem 4px 2rem;
	
	min-width: 110px;
	
	text-decoration: none;
	margin-top: 6px;	
	margin-bottom: 6px;
	margin-left: 3px;
	
	border-radius: 100px;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}


/*ボタン（グレー）*/
.button_gray{
	display: inline-block;
	position: relative;
	text-align: center;
	font-size: 1.5rem;
	color: #ffffff !important;
	background-color: #656161;

	border: solid 1px #494645;
	padding: 4px 2rem 4px 2rem;
	
	min-width: 110px;
	
	text-decoration: none;
	margin-top: 6px;	
	margin-bottom: 6px;
	
	border-radius: 100px;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

.button_gray:hover{
	text-decoration: none;
	border: solid 1px #7E7E7E !important;
	background-color: #7E7E7E !important;
	
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}





/*ブランクアイコン*/
.icon_blank:after {
	content:"";
	display: inline-block;
	margin-top: -4px;
	margin-left: 6px;
	width: 16px;
	height: 16px;
	background: url(../img/icon_32_blank_blue.png) no-repeat right center;
	background-size: 16px 16px;
	text-decoration: underline;
	vertical-align: middle;
	
}

.button.icon_blank:after{
	background: url(../img/icon_32_blank_black.png) no-repeat right center;
	background-size: 16px 16px;
}

.button.icon_blank:hover:after,
.button_gray.icon_blank:after,
.button_gray.icon_blank:hover:after {
	content:"";
	display: inline-block;
	margin-top: -4px;
	margin-left: 6px;
	width: 16px;
	height: 16px;
	background: url(../img/icon_32_blank_white.png) no-repeat right center;
	background-size: 16px 16px;
	text-decoration: underline;
	vertical-align: middle;
}



/*ダウンロードアイコン*/
.icon_download:after {
	content:"";
	display: inline-block;
	margin-top: -4px;
	margin-left: 6px;
	width: 16px;
	height: 16px;
	background: url(../img/icon_32_download_blue.png) no-repeat right center;
	background-size: 16px 16px;
	text-decoration: underline;
	vertical-align: middle;
}

.button.icon_download:after{
	background: url(../img/icon_32_download_black.png) no-repeat right center !important;
	background-size: 16px 16px !important;
}

.button.icon_download:hover:after,
.button_gray.icon_download:after,
.button_gray.icon_download:hover:after {
	content:"";
	display: inline-block;
	margin-top: -4px;
	margin-left: 6px;
	width: 16px;
	height: 16px;
	background: url(../img/icon_32_download_white.png) no-repeat right center !important;
	background-size: 16px 16px !important;
	text-decoration: underline;
	vertical-align: middle;
}

/*PDFアイコン*/
.icon_pdf:after {
	content:"";
	display: inline-block;
	margin-top: -4px;
	margin-left: 6px;
	width: 16px;
	height: 16px;
	background: url(../img/icon_32_pdf_blue.png) no-repeat right center;
	background-size: 16px 16px;
	text-decoration: underline;
	vertical-align: middle;
}

.button.icon_pdf:after{
	background: url(../img/icon_32_pdf_black.png) no-repeat right center;
	background-size: 16px 16px;
}

.button.icon_pdf:hover:after,
.button_gray.icon_pdf:after,
.button_gray.icon_pdf:hover:after {
	content:"";
	display: inline-block;
	margin-top: -4px;
	margin-left: 6px;
	width: 16px;
	height: 16px;
	background: url(../img/icon_32_pdf_white.png) no-repeat right center;
	background-size: 16px 16px !important;
	text-decoration: underline;
	vertical-align: middle;
}


/*Wordアイコン*/
.icon_word:after {
	content:"";
	display: inline-block;
	margin-top: -4px;
	margin-left: 6px;
	width: 16px;
	height: 16px;
	background: url(../img/icon_32_word_blue.png) no-repeat right center;
	background-size: 16px 16px;
	text-decoration: underline;
	vertical-align: middle;
}

.button.icon_word:after{
	background: url(../img/icon_32_word_black.png) no-repeat right center;
	background-size: 16px 16px;
}

.button.icon_word:hover:after,
.button_gray.icon_word:after,
.button_gray.icon_word:hover:after {
	content:"";
	display: inline-block;
	margin-top: -4px;
	margin-left: 6px;
	width: 16px;
	height: 16px;
	background: url(../img/icon_32_word_white.png) no-repeat right center;
	background-size: 16px 16px !important;
	text-decoration: underline;
	vertical-align: middle;
}


/*Excelアイコン*/
.icon_excel:after {
	content:"";
	display: inline-block;
	margin-top: -4px;
	margin-left: 6px;
	width: 16px;
	height: 16px;
	background: url(../img/icon_32_excel_blue.png) no-repeat right center;
	background-size: 16px 16px;
	text-decoration: underline;
	vertical-align: middle;
}

.button.icon_excel:after{
	background: url(../img/icon_32_excel_black.png) no-repeat right center;
	background-size: 16px 16px;
}

.button.icon_excel:hover:after,
.button_gray.icon_excel:after,
.button_gray.icon_excel:hover:after {
	content:"";
	display: inline-block;
	margin-top: -4px;
	margin-left: 6px;
	width: 16px;
	height: 16px;
	background: url(../img/icon_32_excel_white.png) no-repeat right center;
	background-size: 16px 16px !important;
	text-decoration: underline;
	vertical-align: middle;
}


/*メールアイコン*/
.icon_mail:after {
	content:"";
	display: inline-block;
	margin-top: -4px;
	margin-left: 6px;
	width: 16px;
	height: 16px;
	background: url(../img/icon_32_mail_blue.png) no-repeat right center;
	background-size: 16px 16px;
	text-decoration: underline;
	vertical-align: middle;
}

.button.icon_mail:after{
	background: url(../img/icon_32_mail_black.png) no-repeat right center;
	background-size: 16px 16px;
}

.button.icon_mail:hover:after,
.button_gray.icon_mail:after,
.button_gray.icon_mail:hover:after {
	content:"";
	display: inline-block;
	margin-top: -4px;
	margin-left: 6px;
	width: 16px;
	height: 16px;
	background: url(../img/icon_32_mail_white.png) no-repeat right center;
	background-size: 16px 16px !important;
	text-decoration: underline;
	vertical-align: middle;
}


/*facebookアイコン*/
.icon_fb:after {
	content:"";
	display: inline-block;
	margin-top: -4px;
	margin-left: 6px;
	width: 16px;
	height: 16px;
	background: url(../img/icon_32_fb_blue.png) no-repeat right center;
	background-size: 16px 16px;
	text-decoration: underline;
	vertical-align: middle;
}

.button.icon_fb:after{
	background: url(../img/icon_32_fb_black.png) no-repeat right center;
	background-size: 16px 16px;
}

.button.icon_fb:hover:after,
.button_gray.icon_fb:after,
.button_gray.icon_fb:hover:after {
	content:"";
	display: inline-block;
	margin-top: -4px;
	margin-left: 6px;
	width: 16px;
	height: 16px;
	background: url(../img/icon_32_fb_white.png) no-repeat right center;
	background-size: 16px 16px !important;
	text-decoration: underline;
	vertical-align: middle;
}

/*youtubeアイコン*/
.icon_yt:after {
	content:"";
	display: inline-block;
	margin-top: -4px;
	margin-left: 6px;
	width: 16px;
	height: 16px;
	background: url(../img/icon_32_yt_blue.png) no-repeat right center;
	background-size: 16px 16px;
	text-decoration: underline;
	vertical-align: middle;
}

.button.icon_yt:after{
	background: url(../img/icon_32_yt_black.png) no-repeat right center;
	background-size: 16px 16px;
}

.button.icon_yt:hover:after,
.button_gray.icon_yt:after,
.button_gray.icon_yt:hover:after {
	content:"";
	display: inline-block;
	margin-top: -4px;
	margin-left: 6px;
	width: 16px;
	height: 16px;
	background: url(../img/icon_32_yt_white.png) no-repeat right center;
	background-size: 16px 16px !important;
	text-decoration: underline;
	vertical-align: middle;
}





.sp_only,
.sp_only {
	display:none;
}

.pc_only,
.pc_only {
}

.print_only,
.print_only {
	display:none;
}

/*PCの「p」だけマージンボトム20、スマホは0*/
.pc_only_mb20,
.pc_only_mb20 {
	margin-bottom:20px;
}









/* ---------- 要素の上下マージン ---------- */

/*p {
	margin-bottom:20px;
}*/

.mb200,
table.mb200 {
	margin-bottom:120px !important;
}

.mb180,
table.mb180 {
	margin-bottom:180px !important;
}

.mb150,
table.mb150 {
	margin-bottom:150px !important;
}

.mb120,
table.mb120 {
	margin-bottom:120px !important;
}

.mb100,
table.mb100 {
	margin-bottom:100px !important;
}

.mb90,
table.mb90 {
	margin-bottom:90px !important;
}

.mb80,
table.mb80 {
	margin-bottom:80px !important;
}

.mb70,
table.mb70 {
	margin-bottom:70px !important;
}

.mb60,
table.mb60 {
	margin-bottom:60px !important;
}

.mb50,
table.mb50 {
	margin-bottom:50px !important;
}

.mb40,
table.mb40 {
	margin-bottom:40px !important;
}

.mb30,
table.mb30 {
	margin-bottom:30px !important;
}

.mb20,
table.mb20 {
	margin-bottom:20px !important;
}

.mb15,
table.mb15  {
	margin-bottom:15px !important;
}

.mb10,
table.mb10 {
	margin-bottom:10px !important;
}

.mb5,
table.mb5 {
	margin-bottom:5px !important;
}

.mb0,
table.mb0 {
	margin-bottom:0px !important;
}

.mt0 {
	margin-top:0px !important;
}

.mt5 {
	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;
}

.mt60 {
	margin-top:60px !important;
}

.mt70 {
	margin-top:70px !important;
}

.mt80 {
	margin-top:80px !important;
}

.mt90 {
	margin-top:90px !important;
}

.mt100 {
	margin-top:100px !important;
}

.mt-10 {
	margin-top:-10px !important;
}

.mt-20 {
	margin-top:-20px !important;
}

.mt-30 {
	margin-top:-30px !important;
}

.mt-40 {
	margin-top:-40px !important;
}

.mt-50 {
	margin-top:-50px !important;
}

.mt-60 {
	margin-top:-60px !important;
}

.mt-70 {
	margin-top:-70px !important;
}

.mt-80 {
	margin-top:-80px !important;
}

.mt-90 {
	margin-top:-90px !important;
}

.mt-100 {
	margin-top:-100px !important;
}




/* --------------------
	
ページ内アンカーの飛び先

-------------------- */

.anchor{
	margin-top: -80px;
	padding-top: 80px;
}


/* --------------------
	
googleマップ、youtube動画等のiframe埋め込み

-------------------- */

/*youtube配置欄　div*/
/*※横幅を調整したい場合はこのdivに指定する*/
.youtube_box,
.movie_box{
	display: block;
	position: relative;
	max-width: 720px;
	margin: 0 auto;
}

.youtube_box_inner,
.movie_box_inner{
	display: block;
	position: relative;
	width: 100%;
	height: auto !important;
	padding-bottom: 56.25%;
	margin: 0 auto;
}

.youtube_box iframe,
.movie_box iframe{
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
}



/*googleマップ配置欄　div*/
.map_box{
	display: block;
	position: relative;
	width: 100%;
	height: auto !important;
	padding-bottom: 45vh;
	margin: 0 auto;
}


.map_box iframe,
.map_box object,
.map_box embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}





/*--------------------------------

トップページ専用スタイル

--------------------------------*/


#bg_scroll_box{
	display: block;
    position: fixed;
    width: 100%;
    height: 20vh;
    min-height: 140px;
    bottom: 50px;
    left: 0px;
    right: 0px;
    
    background: url(../img/bg_scroll_alpha.png) repeat-x;
    background-position: left top;
    background-size: contain;
    
    z-index: 9999;
}

#bg_scroll {
	display: block;
	position: relative;
	height: 100%;
    background-image: url(../img/bg_scroll.svg);
    background-repeat: no-repeat;
    /*background-size: 150%;*/
    background-size: auto 100%;
    background-position: bottom left;
    
    transition-property: background-position;
    transition-duration: .7s;
    transition-delay: .0s;/*緩急をつける場合　例：.35s*/
    
    z-index: 9999;
    
    pointer-events: none;
    
}



/*-------------------------------- メイン写真 --------------------------------*/

#main_img_box {
	display: flex; /* 子要素をflexboxで揃える */
    flex-direction: column; /* 子要素をflexboxにより縦方向に揃える */
    justify-content: center; /* 子要素をflexboxにより中央に配置する */
    align-items: center;  /* 子要素をflexboxにより中央に配置する */
	position:relative;
	height: calc(100vh - 30vh);
	min-height: 300px;
	margin-bottom: 30vh;
	clear:both;
	float:none;
	
	/*background: url(../img/main_img_bg.jpg) no-repeat center center;
	background-size: cover;*/
}

.main_img {
	display: block;
	position: relative;
	width: 26%;
	min-width: 320px;
	padding-bottom: 45.283%;
}

.main_img img{
	display: block;
	position: fixed;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 100%;
	height: auto;
}


/*-------------------------------- 新北海道スタイルバナー --------------------------------*/

.hokkaido_style_box{
	display: block;
	position: relative;
	margin: 0 auto;
	text-align: center;
	padding-top: 3rem;
	padding-bottom: 5rem;
}

.hokkaido_style_box a{
	display: inline-block;
	position: relative;
	border: solid 2px #e7e7e7;
}





/*--------------------------------

DOT似顔絵メーカーのコンテンツ部分

--------------------------------*/


.contents_section_dot_nigaoe_maker{
	background-color:#000;
	max-width: calc(640px + 3rem + 3rem);
	margin: 0 auto;
}


.contents_section_dot_nigaoe_maker .section_inner{
	padding:0px 20px 10px 20px;
	margin:0px 0px 20px 0px;
}

.contents_section_dot_nigaoe_maker .section_inner p{
	color:#FFF; 
}

.contents_section_dot_nigaoe_maker .section_inner .holizon640{
	clear:both;
	width:100%;
	height:1px;
	margin:20px 0 20px 0;
	border:none;
	border-top:solid 1px #cccccc;
	color:#ffffff;
	background:#ffffff;
	}
@media screen and ( max-width: 560px ) {
.contents_section_dot_nigaoe_maker .section_inner .holizon640{
	clear:both;
	width:100%;
	height:1px;
	margin:30px 0 30px 0;
	border:none;
	border-top:solid 1px #cccccc;
	color:#ffffff;
	background:#ffffff;
	}
}


@media screen and ( max-width: 560px ) {
.app_banner_box {
	display:block;
	width:100%;
	text-align:center;
	float:none;
	margin-bottom:10px;
}

.app_banner_box_left_margin {
	margin-left:0px;
}

}

.contents_section_dot_nigaoe_maker .section_inner .qanda{/*ul*/
	color:#FFF;
	list-style:none;
	margin:0 !important;
	padding:0 !important;
}

.contents_section_dot_nigaoe_maker .section_inner .qanda li{
	display:block;
	overflow:hidden;
	list-style:none;
	padding-top:15px !important;
	padding-bottom:20px !important;
	border-top:dotted 1px #FFF;
	font-size:90%;
}

.q_color{
	color:#00b7ee;
	font-size:140%;
	padding-right:5px;
}

.a_color{
	color:#e5004f;
	font-size:140%;
	padding-right:5px;
}



/*--------------------------------

ABDUCTION UFOのコンテンツ部分

--------------------------------*/

.contents_section_abduction_ufo{
	background-color:#F5E02D;
	
	max-width: calc(640px + 3rem + 3rem);
	margin: 0 auto;
}


.contents_section_abduction_ufo .section_inner{
	padding:0px 20px 10px 20px;
	margin:0px 0px 20px 0px;
}

.contents_section_abduction_ufo .section_inner p{
	color:#000000; 
}

.contents_section_abduction_ufo .section_inner .holizon640{
	clear:both;
	width:100%;
	height:1px;
	margin:20px 0 20px 0;
	border:none;
	border-top:dotted 1px #000000;
	color:#F5E02D;
	background:#F5E02D;
}



.contents_section_abduction_ufo .section_inner .qanda{/*ul*/
	color:#000000;
	list-style:none;
	margin:0 !important;
	padding:0 !important;
}

.contents_section_abduction_ufo .section_inner .qanda li{
	display:block;
	overflow:hidden;
	list-style:none;
	padding-top:15px !important;
	padding-bottom:20px !important;
	border-top:dotted 1px #000000;
	font-size:90%;
}

.contents_section_abduction_ufo .q_color{
	color:#000000;
	font-size:140%;
	padding-right:5px;
}

.contents_section_abduction_ufo .a_color{
	color:#e5004f;
	font-size:140%;
	padding-right:5px;
}


.contents_section_abduction_ufo .coming_soon_img{
	filter:alpha(opacity=60); /*IE*/
	-moz-opacity:0.60; /*FF*/
	opacity:0.60;
}





/*--------------*/


.app_banner_box {
	display:block;
	width:270px;
	text-align:center;
	float:left;
	margin-bottom:10px;
}

.app_banner_box_left_margin {
	margin-left:50px;
}





/*--------------------------------

新北海道スタイル

--------------------------------*/

.contents_section_hokkaido_style{
	max-width: calc(840px + 3rem + 3rem) !important;
	margin: 0 auto;
}

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




/*=========================iPad用スタイルここから=========================*/


@media screen and (min-width: 736px) and (max-width: 1024px) {/*元 min-width:768、max-width: 920px*/
/*iPhone Plusの横向きのwidthが736pxのため、Plusでは縦でスマホ版、横でiPad版を表示*/

body {
	/*width: 1366px !important;*/
	/*width: 920px !important;*/
}

}/*iPad用スタイルここまで*/















/*=========================スマホ用スタイルここから=========================*/

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

body {
	background-color: #ffffff !important;
	min-width: 200px !important;
	width: 320px !important;
	width: 100% !important;
	margin-top: 0px !important;
	-webkit-text-size-adjust: 100%;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	
}


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


/*-------------------------------- 

ヘッダー指定

--------------------------------*/


/* --------------------- PC：メインロゴ --------------------- */

.site-title{
	display:block;
	position:fixed;
	top:0;
	left: 0px;
	right:0px;
	padding: 10px 15px 10px 15px;
	background-color: #ffffff;
	border-bottom: 1px solid #e7e7e7;
	border-left: 0px solid #e7e7e7;
	
	z-index: 9999;
}

.site-title a{
	display:block;
	position: relative;
	width:100%;
	height:24px;
	text-decoration:none;
	background:url(../img/logo_a.svg) no-repeat center center;
}

.site-title a b{
	display: none;
}



/* ----------
	
パンくず　section

---------- */

.topicpath_area {
	display: block;
	clear: both;
	width: 100%;
	margin-top: 120px;
	background-color: #ffffff;
}


/*パンくずをくくったdiv*/
.topicpath_outer{
	padding: 0px 0px 0px 0px;
	padding-left: 60px;
	padding-right: 60px;
}


/* ----------パンくずリスト全体の設定---------- */

div.topicpath {
	display: block;
	width: 100%;
	margin: 0px auto 0px auto;
	padding-left: 2rem;
	padding-right: 2rem;
	text-align: left;
	clear: both;

	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-ms-box-sizing: border-box;
}

/* ----------パンくずリストそのものの設定---------- */

div.topicpath ul {
	margin: 0;
	padding: 0px 0px 0px 0px;
	font-size: 1.2rem;
	text-align: left;
	overflow: hidden;
}

/* ----------リンクのないリスト（＝閲覧しているページ）---------- */
div.topicpath li {
	color: #A5A5A5;
	list-style-type: none;
	padding:0px 4px 0px 4px;
	float: left;
	line-height: none;
	
	background: none;
}


/* ----------リンクのあるリスト（＝上位のページ）---------- */
div.topicpath li a {
	margin-right: 1px;
	color: #A5A5A5;
	padding-right: 0px;
	line-height: none;
	padding-top: 0px;
	text-decoration: underline;
	font-weight: normal;
}

div.topicpath li a:hover {
	color: #00C3F0;
}

div.topicpath li a:after {
	content:">";
	display: inline-block;
	margin-left: 1rem;
	margin-right: 0rem;
}

	



/*--------------------------------

メインメニュー設定

--------------------------------*/




/* -------------------------------- 

 レイアウト設定
 
-------------------------------- */

div#contents_all{
	margin-bottom: 60px;
}

.frontpage div#contents_all{
	padding-top: 0px;
	margin-bottom: calc(20vh + 60px) !important;
}


div#contents_main{
	display: block;
	position: relative;
	max-width: 96vw;
	margin: 0 auto;
}




/*------------------------------

フッター

------------------------------*/

#footer{
	display: block;
	position:fixed;
	bottom: 0px;
	left: 0px;
	right: 0px;
	height: 50px;
	margin: 0 auto ;
	text-align:center;
	background-color: #ffffff;
	clear:both;
}

.footer_inner{
	display: flex; /* 子要素をflexboxで揃える */
    flex-direction: column; /* 子要素をflexboxにより縦方向に揃える */
    justify-content: center; /* 子要素をflexboxにより中央に配置する */
    align-items: center;  /* 子要素をflexboxにより中央に配置する */
	width: 100%;
	height: 50px;
	padding-left: 15px;
	padding-right: 15px;
}

.footer_inner p{
	display: block;
	width: 100%;
	vertical-align: middle;
	text-align: left;
	font-size: 1.2rem;
}

/* ----------ページTOPへボタン---------- */
#pagetop_wrapper {
	display: block;
	position: fixed;
	right: 0px;
	bottom: 0px;
	width: 50px;
	height: 50px;
	padding: 0;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.pagetop {
	display: table-cell;
	width: 100%;
	height: 50px;
}

.pagetop a {
	display: block;
	width: 50px;
	height: 50px;
	background:url(../img/pagetop.png) center center no-repeat;
	background-size: 50px 50px;
	background-color: rgba(0,0,0,0.1);
}

.pagetop a:hover {
	background-color: rgba(0,0,0,0.2);
}

.pagetop a span {
	display:none;
}






/*------------------------------

各パーツ設定

------------------------------*/

/*各段落のタイトル欄　div*/
.section_title_box{
	display: block;
	position: relative;
	padding-left: 2rem;
	padding-right: 2rem;
	margin-bottom: 3rem;
	
}

.section_title_box h1{
	font-size: 2.4rem;
	font-weight: 300;
}

.section_title_box h1 b{
	display: none;
}

.section_content_box{
	display: block;
	position: relative;
	padding-left: 2rem;
	padding-right: 2rem;
	padding-bottom: 2rem;
}



/* -------------------- H1 -------------------- */

h1{
	font-size: 2.2rem;
}



/* -------------------- H2 -------------------- */

h2{
	font-size: 1.8rem;
	margin-bottom: 2rem;
}


/* -------------------- H3 -------------------- */

h3{

}


/* -------------------- H4/H5/H6 見出し設定 -------------------- */

h4{
	font-weight:bold;
}

h5{
	font-weight:bold;
}

h6{
	font-weight:bold;
}

/* ---------- 記事のpノーマル ---------- */

/*コメントタグをpダグで入れる場合に使用（<p class="comment">コメント</p>）*/
p.comment {
	display: none;
}

/*右にfloatさせる　主にpタグに指定*/
.float_left{
	float: left;
	padding-right: 10px;
}

.float_none{
	float:none;
	margin-right: 0px;
}




/* -----------------------

各パーツ設定

----------------------- */


/* ---------- 記事のpノーマル ---------- */
/*PCのスタイルをそのまま利用*/

/*サイズアップ*/
/*基本はPCのスタイルをそのまま利用*/
/*SPのみフォントサイズを変更する場合*/
.sp_fs_100{font-size:110% !important;}
.sp_fs_110{font-size:110% !important;}
.sp_fs_120{font-size:120% !important;}
.sp_fs_130{font-size:130% !important;}
.sp_fs_140{font-size:140% !important;}
.sp_fs_150{font-size:150% !important;}
.sp_fs_160{font-size:160% !important;}
.sp_fs_170{font-size:170% !important;}
.sp_fs_180{font-size:180% !important;}
.sp_fs_190{font-size:190% !important;}
.sp_fs_200{font-size:200% !important;}
.sp_fs_210{font-size:210% !important;}
.sp_fs_220{font-size:220% !important;}
.sp_fs_230{font-size:230% !important;}
.sp_fs_240{font-size:240% !important;}
.sp_fs_250{font-size:250% !important;}
.sp_fs_260{font-size:260% !important;}
.sp_fs_270{font-size:270% !important;}
.sp_fs_280{font-size:280% !important;}
.sp_fs_290{font-size:290% !important;}
.sp_fs_300{font-size:300% !important;}

/*サイズダウン*/
/*基本はPCのスタイルをそのまま利用*/
/*SPのみフォントサイズを変更する場合*/
.sp_fs_95{font-size:95% !important;}
.sp_fs_90{font-size:90% !important;}
.sp_fs_85{font-size:85% !important;}
.sp_fs_80{font-size:80% !important;}
.sp_fs_75{font-size:75% !important;}
.sp_fs_70{font-size:70% !important;}
.sp_fs_60{font-size:60% !important;}
.sp_fs_50{font-size:50% !important;}
.sp_fs_40{font-size:40% !important;}
.sp_fs_30{font-size:30% !important;}
.sp_fs_20{font-size:20% !important;}
.sp_fs_10{font-size:10% !important;}



/* ---------- スマホで非表示（display: none）にしたいものを囲むspanのclass ---------- */
.sp_none{
	display: none !important;
}

/* ---------- スマホで非表示（display: none）にしたいものを囲むspanのclass ---------- */
.sp_none{
	display: none !important;
}

.sp_mb0{
	margin-bottom: 0px !important;
}

.sp_mb1{
	margin-bottom: 1px !important;
}

.sp_mb2{
	margin-bottom: 2px !important;
}

.sp_mb3{
	margin-bottom: 3px !important;
}

.sp_mb4{
	margin-bottom: 4px !important;
}

.sp_mb5{
	margin-bottom: 5px !important;
}

.sp_mb6{
	margin-bottom: 6px !important;
}

.sp_mb7{
	margin-bottom: 7px !important;
}

.sp_mb8{
	margin-bottom: 8px !important;
}

.sp_mb9{
	margin-bottom: 9px !important;
}

.sp_mb10{
	margin-bottom: 10px !important;
}

.sp_mb15{
	margin-bottom: 15px !important;
}

.sp_mb20{
	margin-bottom: 20px !important;
}

.sp_mb25{
	margin-bottom: 25px !important;
}

.sp_mb30{
	margin-bottom: 30px !important;
}

.sp_mb40{
	margin-bottom: 40px !important;
}

.sp_mb50{
	margin-bottom: 50px !important;
}

.sp_mb60{
	margin-bottom: 60px !important;
}

.sp_mb70{
	margin-bottom: 70px !important;
}

.sp_mb80{
	margin-bottom: 80px !important;
}

.sp_mb90{
	margin-bottom: 90px !important;
}

.sp_mb100{
	margin-bottom: 100px !important;
}



.sp_mt0{
	margin-top: 0px !important;
}

.sp_mt10{
	margin-top: 10px !important;
}

.sp_mt20{
	margin-top: 20px !important;
}

.sp_mt30{
	margin-top: 30px !important;
}

.sp_mt40{
	margin-top: 40px !important;
}

.sp_mt50{
	margin-top: 50px !important;
}

.sp_mt60{
	margin-top: 60px !important;
}

.sp_mt70{
	margin-top: 70px !important;
}

.sp_mt80{
	margin-top: 80px !important;
}

.sp_mt90{
	margin-top: 90px !important;
}

.sp_mt100{
	margin-top: 100px !important;
}


.sp_mt-10{
	margin-top: -10px !important;
}

.sp_mt-20{
	margin-top: -20px !important;
}

.sp_mt-30{
	margin-top: -30px !important;
}

.sp_mt-40{
	margin-top: -40px !important;
}

.sp_mt-50{
	margin-top: -50px !important;
}

.sp_mt-60{
	margin-top: -60px !important;
}

.sp_mt-70{
	margin-top: -70px !important;
}

.sp_mt-80{
	margin-top: -80px !important;
}

.sp_mt-90{
	margin-top: -90px !important;
}

.sp_mt-100{
	margin-top: -100px !important;
}



.sp_pb0{
	padding-bottom: 0px !important;
}

.sp_pb1{
	padding-bottom: 1px !important;
}

.sp_pb2{
	padding-bottom: 2px !important;
}

.sp_pb3{
	padding-bottom: 3px !important;
}

.sp_pb4{
	padding-bottom: 4px !important;
}

.sp_pb5{
	padding-bottom: 5px !important;
}

.sp_pb6{
	padding-bottom: 6px !important;
}

.sp_pb7{
	padding-bottom: 7px !important;
}

.sp_pb8{
	padding-bottom: 8px !important;
}

.sp_pb9{
	padding-bottom: 9px !important;
}

.sp_pb10{
	padding-bottom: 10px !important;
}

.sp_pb15{
	padding-bottom: 15px !important;
}

.sp_pb20{
	padding-bottom: 20px !important;
}

.sp_pb25{
	padding-bottom: 25px !important;
}

.sp_pb30{
	padding-bottom: 30px !important;
}

.sp_pb40{
	padding-bottom: 40px !important;
}

.sp_pb50{
	padding-bottom: 50px !important;
}

.sp_pb60{
	padding-bottom: 60px !important;
}

.sp_pb70{
	padding-bottom: 70px !important;
}

.sp_pb80{
	padding-bottom: 80px !important;
}

.sp_pb90{
	padding-bottom: 90px !important;
}

.sp_pb100{
	padding-bottom: 100px !important;
}



.sp_pt0{
	padding-top: 0px !important;
}

.sp_pt10{
	padding-top: 10px !important;
}

.sp_pt20{
	padding-top: 20px !important;
}

.sp_pt30{
	padding-top: 30px !important;
}

.sp_pt40{
	padding-top: 40px !important;
}

.sp_pt50{
	padding-top: 50px !important;
}

.sp_pt60{
	padding-top: 60px !important;
}

.sp_pt70{
	padding-top: 70px !important;
}

.sp_pt80{
	padding-top: 80px !important;
}

.sp_pt90{
	padding-top: 90px !important;
}

.sp_pt100{
	padding-top: 100px !important;
}


/*スマホのみ左右中央揃えの指定　text-alignの略*/
.sp_ta_center{text-align: center !important;}
.sp_ta_left{text-align: left !important;}
.sp_ta_right{text-align: right !important;}



/* ---------- 記事のpノーマル ---------- */

/* ---------- 白ベタエリア　div ---------- */

/* ---------- 写真の配置設定 ---------- */

/*WPのメディアライブラリから挿入されたとき、自動的に挿入されるdivのclass*/
.wp-caption {
}

.wp-caption img {
	margin: 0;
	padding: 0;
	border: 0 none;
	
	height: auto;
}

/* ---------- 画像配置関連 キャプション付きの回し込み ---------- */

img{

}

/*画像とキャプション両方を囲んだDIVのクラス設定：回り込み無し*/
.alignone{
	display: block;
	width: 100%!important;
	margin-bottom: 10px;
	clear: left;
}

/*画像とキャプション両方を囲んだDIVのクラス設定：中央揃え*/
/* ----------写真を中央に配置---------- */

/* ----------画像まわしこみを解除----------*/
.aligncenter {
	float: none;
}

/*画像とキャプション両方を囲んだDIVのクラス設定：画像が左寄せになる場合*/

/*メディアライブラリから挿入した時の、imgのclass*/
.aligncenter {
	padding-right: 0px;
	padding-left: 0px;
	margin: 0 auto;
	margin-bottom: 10px;
	width: 100%;
	height: auto;
	text-align: center;
	
	float: none;
}

.alignright {
	padding-right: 0px;
	margin-right: 0px;
	padding-left: 0px;
	margin-left: 0px;
	margin-bottom: 10px;
	width: 100%;
	height: auto;
	text-align: center;
	
	float: none;
}

.alignleft {
	padding-right: 0px;
	margin-right: 0px;
	padding-left: 0px;
	margin-left: 0px;
	margin-bottom: 10px;
	width: 100%;
	height: auto;
	text-align: center;
	
	float: none;
}

/*PCではalignleft、alignrightを指定しつつ、スマホではセンターにしたい場合。　※例）alignleft sp_aligncenter 併記*/
.sp_aligncenter {
	display: block;
	padding-right: 0px;
	padding-left: 0px;
	margin: 0 auto !important;
	margin-bottom: 10px !important;
	height: auto;
	text-align: center !important;
	
	float: none;
}

.alignnone {
	padding-right: 0px;
	margin-right: 0px;
	padding-left: 0px;
	margin-left: 0px;
	margin-bottom: 10px;
	width: 100%;
	height: auto;
	text-align: center;
	
	float: none;
}

/*PCではalignleft、alignrightを指定しつつ、スマホではセンターにしたい場合。　※例）alignleft sp_alignnone 併記*/
.sp_alignnone {
	display: block;
	padding-right: 0px;
	padding-left: 0px;
	margin: 0 auto !important;
	margin-bottom: 10px !important;
	height: auto;
	text-align: center !important;
	
	float: none;
}


img.aligncenter,
img.alignright,
img.alignleft,
img.alignnone{
	text-align: center;
	margin: 0 auto;
	max-width: 480px !important;
}



/* ----------写真を左に配置---------- */
.alignleft img {
	display: block;
	float: none;
	padding-right: 0px !important;
	margin-right: 0px !important;
	padding-left: 0px !important;
	margin-left: 0px !important;
	margin: 0 auto !important;
	margin-bottom: 10px !important;
	max-width: 480px !important;
	width: 100% !important;
	height: auto;
}

/* ----------写真を右側に配置---------- */
.alignright img {
	display: block;
	float: none;
	padding-right: 0px !important;
	margin-right: 0px !important;
	padding-left: 0px !important;
	margin-left: 0px !important;
	margin: 0 auto !important;
	margin-bottom: 10px !important;
	max-width: 480px !important;
	width: 100% !important;
	height: auto;
}

/* ----------スマホだけ写真を中央に配置---------- */
.aligncenter img,
.sp_aligncenter img {
	display: block;
	float: none;
	padding-right: 0px !important;
	margin-right: 0px !important;
	padding-left: 0px !important;
	margin-left: 0px !important;
	margin: 0 auto !important;
	margin-bottom: 10px !important;
	max-width: 480px !important;
	width: 100% !important;
	height: auto;
}


/*キャプションのスタイル（alignnone、alignleft、alignrightの場合）*/
p.wp-caption-text,
.wp-caption-text {
	display: block;
	text-align: left;
	font-size: 90%;
	line-height: 140%;
	color: #797979;
	clear: both;
}

/*キャプションのスタイル（aligncenterの場合）*/
.aligncenter .wp-caption-text{
	display: block;
	text-align: left;
	font-size: 90%;
	line-height: 130%;
	color: #797979;
	clear: both;
}



/* 右寄せで写真を縦に並べるカラム状のボックス */

.photo_column_right{
	float:none;
	 margin-left:0px;
}

/*alignleft、alignright等と併記して、横幅を%可変にする スマホのみ*/
.sp_w10per{width: 10% !important;}
.sp_w20per{width: 20% !important;}
.sp_w30per{width: 30% !important;}
.sp_w40per{width: 40% !important;}
.sp_w50per{width: 50% !important;}
.sp_w60per{width: 60% !important;}
.sp_w70per{width: 70% !important;}
.sp_w80per{width: 80% !important;}
.sp_w90per{width: 90% !important;}
.sp_w100per{width: 100% !important;}

.sp_w10per img,
.sp_w20per img,
.sp_w30per img,
.sp_w40per img,
.sp_w50per img,
.sp_w60per img,
.sp_w70per img,
.sp_w80per img,
.sp_w90per img,
.sp_w100per img{
	width: 100%;
	max-width: 100%;
	height: auto;
}

.trim.sp_w100per {
	display: block;
	overflow: hidden;
	position: relative;
	width: 100%;
	padding-bottom: 75%;/*4:3*/
	margin-bottom: 10px;
}

.trim.sp_w10per{
	width: 10%;
	padding-bottom: 7.5%;
}

.trim.sp_w20per{
	width: 20%;
	padding-bottom: 15%;
}

.trim.sp_w30per{
	width: 30%;
	padding-bottom: 22.5%;
}

.trim.sp_w40per{
	width: 40%;
	padding-bottom: 30%;
}

.trim.sp_w50per{
	width: 50%;
	padding-bottom: 37.5%;
}

.trim.sp_w60per{
	width: 60%;
	padding-bottom: 45%;
}

.trim.sp_w70per{
	width: 70%;
	padding-bottom: 52.5%;
}

.trim.sp_w80per{
	width: 80%;
	padding-bottom: 60%;
}

.trim.sp_w90{
	width: 90%;
	padding-bottom: 67.5%;
}

.trim.sp_w100perper{
	width: 100%;
	padding-bottom: 75%;
}


.trim_wide.sp_w100per {
	display: block;
	overflow: hidden;
	position: relative;
	width: 100%;
	padding-bottom: 56.625%;/*16:9*/
	margin-bottom: 10px;
}

.trim_wide.sp_w10per{
	width: 10%;
	padding-bottom: 5.6625%;
}

.trim_wide.sp_w20per{
	width: 20%;
	padding-bottom: 11.325%;
}

.trim_wide.sp_w30per{
	width: 30%;
	padding-bottom: 17%;
}

.trim_wide.sp_w40per{
	width: 40%;
	padding-bottom: 22.65%;
}

.trim_wide.sp_w50per{
	width: 50%;
	padding-bottom: 28.3125%;
}

.trim_wide.sp_w60per{
	width: 60%;
	padding-bottom: 33.975%;
}

.trim_wide.sp_w70per{
	width: 70%;
	padding-bottom: 39.6375%;
}

.trim_wide.sp_w80per{
	width: 80%;
	padding-bottom: 45.3%;
}

.trim_wide.sp_w90per{
	width: 90%;
	padding-bottom: 50.9625%;
}

.trim_wide.sp_w100per{
	width: 100%;
	padding-bottom: 56.625%;
}

.trim.sp_w100per img,
.trim_wide.sp_w100per img {
	width: 100%;
	left: 50%;
	left: -webkit-calc(50%) ;
	left: calc(50%) ;
}


.sp_aligncenter.sp_w10per img,
.sp_alignnone.sp_w10per img,
.sp_aligncenter.sp_w20per img,
.sp_alignnone.sp_w20per img,
.sp_aligncenter.sp_w30per img,
.sp_alignnone.sp_w30per img,
.sp_aligncenter.sp_w40per img,
.sp_alignnone.sp_w40per img,
.sp_aligncenter.sp_w50per img,
.sp_alignnone.sp_w50per img,
.sp_aligncenter.sp_w60per img,
.sp_alignnone.sp_w60per img,
.sp_aligncenter.sp_w70per img,
.sp_alignnone.sp_w70per img,
.sp_aligncenter.sp_w80per img,
.sp_alignnone.sp_w80per img,
.sp_aligncenter.sp_w90per img,
.sp_alignnone.sp_w90per img,
.sp_aligncenter.sp_w100per img,
.sp_alignnone.sp_w100per img{
	width: 100%;
	width: -webkit-calc(100%) ;
	width: calc(100%) ;
	left: 0% !important;
	left: -webkit-calc(0px) !important;
	left: calc(0px) !important;
}

.trim.sp_aligncenter.trim.sp_w10per img,
.trim.sp_alignnone.trim.sp_w10per img,
.trim.sp_aligncenter.trim.sp_w20per img,
.trim.sp_alignnone.trim.sp_w20per img,
.trim.sp_aligncenter.trim.sp_w30per img,
.trim.sp_alignnone.trim.sp_w30per img,
.trim.sp_aligncenter.trim.sp_w40per img,
.trim.sp_alignnone.trim.sp_w40per img,
.trim.sp_aligncenter.trim.sp_w50per img,
.trim.sp_alignnone.trim.sp_w50per img,
.trim.sp_aligncenter.trim.sp_w60per img,
.trim.sp_alignnone.trim.sp_w60per img,
.trim.sp_aligncenter.trim.sp_w70per img,
.trim.sp_alignnone.trim.sp_w70per img,
.trim.sp_aligncenter.trim.sp_w80per img,
.trim.sp_alignnone.trim.sp_w80per img,
.trim.sp_aligncenter.trim.sp_w90per img,
.trim.sp_alignnone.trim.sp_w90per img,
.trim.sp_aligncenter.trim.sp_w100per img,
.trim.sp_alignnone.trim.sp_w100per img,
.trim_wide.sp_aligncenter.trim_wide.sp_w10per img,
.trim_wide.sp_alignnone.trim_wide.sp_w10per img,
.trim_wide.sp_aligncenter.trim_wide.sp_w20per img,
.trim_wide.sp_alignnone.trim_wide.sp_w20per img,
.trim_wide.sp_aligncenter.trim_wide.sp_w30per img,
.trim_wide.sp_alignnone.trim_wide.sp_w30per img,
.trim_wide.sp_aligncenter.trim_wide.sp_w40per img,
.trim_wide.sp_alignnone.trim_wide.sp_w40per img,
.trim_wide.sp_aligncenter.trim_wide.sp_w50per img,
.trim_wide.sp_alignnone.trim_wide.sp_w50per img,
.trim_wide.sp_aligncenter.trim_wide.sp_w60per img,
.trim_wide.sp_alignnone.trim_wide.sp_w60per img,
.trim_wide.sp_aligncenter.trim_wide.sp_w70per img,
.trim_wide.sp_alignnone.trim_wide.sp_w70per img,
.trim_wide.sp_aligncenter.trim_wide.sp_w80per img,
.trim_wide.sp_alignnone.trim_wide.sp_w80per img,
.trim_wide.sp_aligncenter.trim_wide.sp_w90per img,
.trim_wide.sp_alignnone.trim_wide.sp_w90per img,
.trim_wide.sp_aligncenter.trim_wide.sp_w100per img,
.trim_wide.sp_alignnone.trim_wide.sp_w100per{
	width: 100%;
	width: -webkit-calc(100%) ;
	width: calc(100%) ;
	left: 50% !important;
	left: -webkit-calc(50% - 0px) !important;
	left: calc(50% - 0px) !important;
}



/*スマホで、画像が大きすぎる場合、max-widthを指定して中央に配置　p このclassが指定されたpタグでくくったimgに適用される*/

/*width:150px*/
.img_width_150,
.img_width_150{
	display: block !important;
	float: none !important;
	min-width: 300px;
	width: 100% !important;
	text-align: center !important;
}

.img_width_150 img,
.img_width_150 img{
	max-width: 150px !important;
}

.img_width_150 img.alignright,
.img_width_150 img.alignright,
.img_width_150 img.alignleft,
.img_width_150 img.alignleft{
	float: none !important;
}

/*width:180px*/
.img_width_180,
.img_width_180{
	display: block !important;
	float: none !important;
	min-width: 300px;
	width: 100% !important;
	text-align: center !important;
}

.img_width_180 img,
.img_width_180 img{
	max-width: 180px !important;
}

.img_width_180 img.alignright,
.img_width_180 img.alignright,
.img_width_180 img.alignleft,
.img_width_180 img.alignleft{
	float: none !important;
}

/*width:200px*/
.img_width_200,
.img_width_200{
	display: block !important;
	float: none !important;
	min-width: 300px;
	width: 100% !important;
	text-align: center !important;
}

.img_width_200 img,
.img_width_200 img{
	max-width: 200px !important;
}

.img_width_200 img.alignright,
.img_width_200 img.alignright,
.img_width_200 img.alignleft,
.img_width_200 img.alignleft{
	float: none !important;
}

/*width:250px*/
.img_width_250,
.img_width_250{
	display: block !important;
	float: none !important;
	min-width: 300px;
	width: 100% !important;
	text-align: center !important;
}

.img_width_250 img,
.img_width_250 img{
	max-width: 250px !important;
}

.img_width_250 img.alignright,
.img_width_250 img.alignright,
.img_width_250 img.alignleft,
.img_width_250 img.alignleft{
	float: none !important;
}

/*width:300px*/
.img_width_300,
.img_width_300{
	display: block !important;
	float: none !important;
	min-width: 300px;
	width: 100% !important;
	text-align: center !important;
}

.img_width_300 img,
.img_width_300 img{
	max-width: 300px !important;
}

.img_width_300 img.alignright,
.img_width_300 img.alignright,
.img_width_300 img.alignleft,
.img_width_300 img.alignleft{
	float: none !important;
}

/*スマホで画像の最大の横幅を規制して、center揃え　imgを囲んでいるdivやpタグにつけるclass*/
.sp_width_10,
.sp_width_16,
.sp_width_20,
.sp_width_24,
.sp_width_30,
.sp_width_36,
.sp_width_40,
.sp_width_48,
.sp_width_50,
.sp_width_60,
.sp_width_70,
.sp_width_80,
.sp_width_90,
.sp_width_100,
.sp_width_120,
.sp_width_160,
.sp_width_180,
.sp_width_210,
.sp_width_220,
.sp_width_240,
.sp_width_270,
.sp_width_300,
.sp_width_320,
.sp_width_340,
.sp_width_420{
	width: 100% !important;
	float: none !important;
	text-align: center;
}

.sp_width_10 img{
	max-width: 10px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}

.sp_width_16 img{
	max-width: 16px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}

.sp_width_20 img{
	max-width: 20px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}

.sp_width_24 img{
	max-width: 24px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}

.sp_width_30 img{
	max-width: 30px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}

.sp_width_36 img{
	max-width: 36px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}

.sp_width_40 img{
	max-width: 40px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}

.sp_width_48 img{
	max-width: 48px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}

.sp_width_50 img{
	max-width: 50px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}

.sp_width_60 img{
	max-width: 60px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}

.sp_width_70 img{
	max-width: 70px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}

.sp_width_80 img{
	max-width: 80px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}

.sp_width_90 img{
	max-width: 90px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}
.sp_width_100 img{
	max-width: 100px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}
.sp_width_120 img{
	max-width: 120px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}
.sp_width_160 img{
	max-width: 160px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}
.sp_width_180 img{
	max-width: 180px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}
.sp_width_210 img{
	max-width: 210px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}
.sp_width_220 img{
	max-width: 220px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}
.sp_width_240 img{
	max-width: 240px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}
.sp_width_270 img{
	max-width: 270px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}
.sp_width_300 img{
	max-width: 300px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}

.sp_width_320 img{
	max-width: 320px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}

.sp_width_340 img{
	max-width: 340px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}

.sp_width_420 img{
	max-width: 420px !important;
	height: auto !important;
	text-align: center !important;
	float: none;
}

/*囲んでいるdivやpではなく、imgに直接classを追加した場合*/
img.sp_width_10,
img.sp_width_16,
img.sp_width_20,
img.sp_width_24,
img.sp_width_30,
img.sp_width_36,
img.sp_width_40,
img.sp_width_48,
img.sp_width_50,
img.sp_width_60,
img.sp_width_70,
img.sp_width_80,
img.sp_width_90,
img.sp_width_100,
img.sp_width_120,
img.sp_width_160,
img.sp_width_180,
img.sp_width_210,
img.sp_width_220,
img.sp_width_240,
img.sp_width_270,
img.sp_width_300,
img.sp_width_320,
img.sp_width_340,
img.sp_width_420{
	height: auto !important;
}

img.sp_width_10{max-width: 10px;}
img.sp_width_16{max-width: 16px;}
img.sp_width_20{max-width: 20px;}
img.sp_width_24{max-width: 24px;}
img.sp_width_30{max-width: 30px;}
img.sp_width_36{max-width: 36px;}
img.sp_width_40{max-width: 40px;}
img.sp_width_48{max-width: 48px;}
img.sp_width_50{max-width: 50px;}
img.sp_width_60{max-width: 60px;}
img.sp_width_70{max-width: 70px;}
img.sp_width_80{max-width: 80px;}
img.sp_width_90{max-width: 90px;}
img.sp_width_100{max-width: 100px;}
img.sp_width_120{max-width: 120px;}
img.sp_width_160{max-width: 160px;}
img.sp_width_180{max-width: 180px;}
img.sp_width_210{max-width: 210px;}
img.sp_width_220{max-width: 220px;}
img.sp_width_240{max-width: 240px;}
img.sp_width_270{max-width: 270px;}
img.sp_width_300{max-width: 300px;}
img.sp_width_320{max-width: 320px;}
img.sp_width_340{max-width: 340px;}
img.sp_width_420{max-width: 420px;}



/* ---------- 記事内のテーブル設定 ---------- */

/*レスポンシブさせたくないtableには「no_responsive_table」というclassを記述する*/
/*.gsc-table-result　は、Googleの検索結果のテーブル*/
/*.gcsc-branding　は、Googleの検索結果の下のpowered byのテーブル*/
/*.table_img_2column は、横並びの画像をスマホでも横並びのまま表示するtableのclass*/
/*.ui-datepicker-calendarは、MW WP Formの日付選択の時に表示されるカレンダーdatepickerのtableのclass*/


table:not(.no_responsive_table):not(.table_img_2column):not(.open_searchbox table) {
	border: none !important;
	border-top: #e8e8e8 solid 1px !important;
}

/*あえて幅をせまく調整したテーブルでも、スマホでは横幅100%にする*/
table.table_90per,
table.table_80per,
table.table_70per,
table.table_60per,
table.table_50per,
table.table_40per,
table.table_30per,
table.table_20per,
table.table_10per {
	width: 100% !important;
}




table:not(.no_responsive_table):not(.table_img_2column):not(.open_searchbox table) tr {
	display: block;
	border: none !important;
	border-bottom: #e8e8e8 solid 1px !important;
	padding:4px 0px 4px 0px;
	margin-bottom: 4px;
	width:100% !important;
}



table:not(.no_responsive_table):not(.table_img_2column):not(.open_searchbox table) th {
	padding: 5px 5px 5px 5px !important;
	margin-bottom: 4px !important;
	background-color: #EDEDE9;
	/*white-space: nowrap;*/
	overflow: hidden;
	display: block;
	border: none !important;
	width:100% !important;
	box-sizing: border-box !important;
	-moz-box-sizing: border-box !important;
	-webkit-box-sizing: border-box !important;
	-ms-box-sizing: border-box !important;
}



table:not(.no_responsive_table):not(.table_img_2column):not(.open_searchbox table) td {
	border-left: none !important;
	word-wrap: break-word;
	overflow: hidden;
	display: block;
	padding: 5px 5px 5px 5px !important;
	margin-bottom: 0px !important;
	border: none !important;
	width:100% !important;
}




/*レスポンシブさせないテーブルのフォントはちょっと小さくする*/
table.no_responsive_table tr{
	padding:0px 0px 0px 0px !important;
	font-size:96% !important;
	line-height:150% !important;
}

table.no_responsive_table th{
	padding:5px 5px 5px 5px !important;
	font-size:96% !important;
	line-height:150% !important;
	white-space:normal !important;
}

table.no_responsive_table td{
	padding:5px 5px 5px 5px !important;
	font-size:96% !important;
	line-height:150% !important;
}



/*tableをスクロールありで表示させる場合、これで囲む　div*/
.table_scroll_box{
	width: auto !important;
	overflow-x:auto !important;
}

.table_scroll_box table.no_responsive_table {
	width: auto;
min-width: 100%;
}

.table_scroll_box table.no_responsive_table tr th,
.table_scroll_box table.no_responsive_table tr td{
	/*white-space: nowrap !important;*/
}

/*改行させない*/
.sp_nowrap,
table tr.sp_nowrap,
table tr th.sp_nowrap,
table tr td.sp_nowrap,
p.sp_nowrap,
span.sp_nowrap{
	white-space: nowrap !important;
}


th img,
td img {
	display: block;
	margin-left: auto;
	margin-right: auto;
	max-width: 480px !important;
	width: 100% !important;
	height: auto;
}


/*横並びの画像をスマホでも横並びのまま表示するtable　のstyle罫線無し**/

table.table_img_2column {
	border: none !important;
	display: block;
	max-width: 100%;
}

table.table_img_2column tr {
	font-size:96% !important;
	line-height:150% !important;
	border: none !important;
}

table.table_img_2column th {
	font-size:96% !important;
	line-height:150% !important;
	white-space:normal !important;
	border: none !important;
}

table.table_img_2column td {
	font-size:96% !important;
	line-height:150% !important;
	border: none !important;
}

table.table_img_2column img{
	margin-bottom: 0px !important;
}



table.table_2column {
	margin-bottom: 0.5rem;
	border-top: #e7e7e7 solid 1px;
	border-left: #e7e7e7 solid 1px;
	width: 100% !important;
	float: none !important;
	margin-right: 0% !important;
}

table.table_4column {
	margin-bottom: 0.5rem;
	border-top: #e7e7e7 solid 1px;
	border-left: #e7e7e7 solid 1px;
	width: 100% !important;
	float: none !important;
	margin-right: 0% !important;
}


/*スマホレスポンシブ対応のテーブル*/
table.sp_responsive_table tr,
table.sp_responsive_table th,
table.sp_responsive_table td {
	display: block;
	width: 100%;
}

table.sp_responsive_table tr{
	margin-bottom: 3rem;
}

table.sp_responsive_table td {
	text-align: left;
}

table.sp_responsive_table .sp_only {
	display:inline-block !important;
}

/*スマホのみ、tr（の上辺）に罫線を追加するスタイル*/
.tr_line_solid_sponly {
	border-top: #e7e7e7 solid 1px !important;
}

.tr_line_dotted_sponly {
	border-top: #e7e7e7 dotted 1px !important;
}


/*桁数を指定して揃える　半角で5文字分*/
span.digit5{
	display:inline;
	width:auto !important;
	text-align: left;
}

/*桁数を指定して揃える　半角で6文字分*/
span.digit6{
	display:inline;
	width:auto !important;
	text-align: left;
}









/*一番上の項目行を左の列に可変テーブル（「no_responsive_table」と併記）*/
table.td_change_table {
	display: block;
	width: 100%;
	border-top: #DBD8CC solid 1px;
	border-left: #DBD8CC solid 0px;
	margin-bottom: 10px !important;
}

table.td_change_table.w_auto{
	width: auto;
}
 
table.td_change_table thead {
	  display: none;
}

table.td_change_table tbody {
	  display: block;
}

table.td_change_table tbody tr {
	display: block;
	position: relative;
	width: 100%;
	padding: 0px !important;
	margin-bottom: 5px;
	
	border-top: #DBD8CC solid 1px !important;
	border-left: #DBD8CC solid 1px !important;
	border-bottom: #DBD8CC solid 0px !important;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

table.td_change_table tbody tr:first-Child {
	border-top: #DBD8CC solid 0px !important;
}

table.td_change_table > tbody > tr > th,
table.td_change_table > tbody > tr > td {
	  display: flex;
	  overflow: hidden;
	  
	  padding: 0px 0px 0px 0px !important;
	  border-right: #DBD8CC solid 0px !important;
	  
	  -webkit-box-sizing: border-box;
	  -moz-box-sizing: border-box;
	  box-sizing: border-box;
	  font-size: 1.4rem !important;
}


table.td_change_table tbody tr th:before,
table.td_change_table tbody tr td:before {
	display: block;
	  width: 24%;
	  content: attr(label);
	  float: left;
	  line-height: 140%;
	  text-align: center;
	  
	  padding: 6px 10px 6px 10px !important;
	  border-right: #DBD8CC solid 1px !important;
	  
	  -webkit-box-sizing: border-box;
	  -moz-box-sizing: border-box;
	  box-sizing: border-box;
	  
}

table.td_change_table tbody tr th,
table.td_change_table tbody tr th p{
}


/*左の列が不要な場合はtd、またはtdに「no_change」を付ける*/
table.td_change_table tbody tr th.no_change:before,
table.td_change_table tbody tr td.no_change:before {
	content: none;
}

table.td_change_table tbody tr th.no_change,
table.td_change_table tbody tr td.no_change {
	padding: 6px 10px 6px 10px !important;
}


table.td_change_table tbody tr th .inner,
table.td_change_table tbody tr td .inner {
	display: block;
	width: 76%;
	  
	  padding: 6px 10px 6px 10px !important;
	line-height: 140%;
	  
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	
	font-size: 1.5rem !important;
}

table.td_change_table tbody tr th {

}

table.td_change_table tbody tr th p,
table.td_change_table tbody tr td p{
	line-height: 140%;
}





/* ---------- 記事内のテーブル設定（レスポンシブさせない） ---------- */

/*tableをスクロールありで表示させる場合、これで囲む　div*/
.table_scroll_box{
	width: auto !important;
	overflow-x:scroll !important;
}

.table_scroll_box table {
	margin-bottom: 0.5rem;
	/*
	border-top: #e7e7e7 solid 1px !important;
	border-left: #e7e7e7 solid 1px !important;
	*/
}



/*tableタグにこのclassが指定されているtableの中に入れ子になっているtableから罫線を取る*/
.table_scroll_box table.td_in_table td table,
.table_scroll_box table.td_in_table td table th,
.table_scroll_box table.td_in_table td table tr,
.table_scroll_box table.td_in_table td table td{
	border: none !important;
	padding: 0px;
}

.table_scroll_box table.td_in_table th{
	width: 30% !important;
	padding:6px 6px 6px 6px !important;
}

.table_scroll_box table.td_in_table td{
	padding:6px 6px 6px 6px !important;
}

.table_scroll_box table.td_in_table td table{
	width: 100% !important;
}

.table_scroll_box table.td_in_table td table tr{
	border: none !important;
	padding:0px 0px 0px 0px;
	width:100% !important;
}

.table_scroll_box table.td_in_table td table td{
	border-left: none !important;
	word-wrap: break-word;
	overflow: hidden;
	display: block;
	padding: 0px 0px 0px 0px !important;
	border: none !important;
	width:100% !important;
}



table.noline,
table.noline tr,
table.noline td,
table.noline th{
	border: 0px !important;
}



/* -------------------- 水平線画像 -------------------- */


/* ---------- 記事内のグレー罫線の囲み（div） ---------- */

.box_gray,
.box_blue,
.box_emerald,
.box_white,
.box_gray_compact,
.box_blue_compact,
.box_white_compact,
.box_gray5,
.box_blue5,
.box_blue3,
.box_gray10,
.box_blue10,
.box_gray_beige5
 {
	padding:10px 10px 10px 10px !important;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-ms-box-sizing: border-box;
}

/*お問い合わせ先フォーマット（「box_gray_beige5」と同じ）*/
.contact_info_box {
	padding:10px 10px 10px 10px !important;
	margin:10px 0px 25px 0px;
	border: solid 5px #F3EFE9;
}


.box_gray img,
.box_blue img,
.box_emerald img,
.box_white img,
.box_gray_compact img,
.box_blue_compact img,
.box_white_compact img,
.box_gray5 img,
.box_blue5 img,
.box_blue3 img,
.box_gray10 img,
.box_blue10 img,
.box_gray_beige5 img {
	width: 100%;
	height: auto !important;
}


/* 背景が薄いグレーのボックス */

.box_bg_gray{
	padding:6px 10px;
}

.box_bg_beige{
	padding:6px 10px;
}


/*「box_gray_XX」と併記して利用*/

/*inline-blockを追加する*/
.display_ib{
	overflow: hidden;
	display: inline-block
}

/*スマホではblock*/
.sp_display_b{
	display: block !important;
}


/* ---------- 記事内のol ---------- */

ol {
	margin-left: 0rem !important;
	padding-left: 2.6rem;
	padding-bottom: 8px;
	list-style-type: decimal;
}

ol > li {
	padding: 2px 0px 6px 0rem;
	text-indent: 0rem;
}

ol > li > ul {
	list-style:none;
	background: none;
	padding: 0px 0px 0px 2.3rem;
	margin-left: -2.3rem;
}

ol > li > ul li {
	text-indent: 0rem;
	padding: 2px 0px 4px 2px;
	padding-left:22px;
	background-image:url(../img/icon_32_disc_black.png) ;
	background-size: 16px 16px;
	background-repeat:no-repeat;
	background-position:0 5px;
}



/* ---------- 記事内のul ---------- */


 ul.float{
	float: none;
	clear: both;
}

 ul.float li {
	width: 100% !important;
	display: block !important;
	padding: 2px 10px 4px 0px;
	float: none !important;
	background:none;
}


/* ---------- 記事内のア、イ、ウ…のli ---------- */

/* ---------- 記事内の注釈 ---------- */



/* ---------- div内で2列にならべるdiv ---------- */

/*2列全体　div*/
.text_box_2column{
	display: block;
	overflow: hidden;
	position: relative;
}

.text_box_2column h2,
.text_box_2column h3{
	display: inline-block;
	margin: 0px 0 10px 0;
}

.text_box_2column p{
}

.text_box_2column_left,
.text_box_2column_right,
.text_box_2column .column_inner{
	display: block;
	overflow: hidden;
	position: relative;
	width: 100% !important;
	margin-right: 0px !important;
	float: none;
}


/* ---------- div内で3列にならべるdiv ---------- */

/*3列全体　div*/
.text_box_3column{
	display: block;
	overflow: hidden;
	position: relative;
}

.text_box_3column h2,
.text_box_3column h3{
	display: inline-block;
	margin: 0px 0 10px 0;
}

.text_box_3column p{
}

.text_box_3column_left,
.text_box_3column_center,
.text_box_3column_right,
.text_box_3column .column_inner{
	display: block;
	overflow: hidden;
	position: relative;
	width: 100% !important;
	margin-right: 0px !important;
	float: none;
}



/* ---------- div内で4列にならべるdiv ---------- */

/*4列全体　div*/
.text_box_4column{
	display: block;
	overflow: hidden;
	position: relative;
}

.text_box_4column h2,
.text_box_4column h3{
	display: block;
	margin: 0px 0px 10px 0px !important;
	float:none;
	clear: both;
}


.text_box_4column p{
}

.text_box_4column_1,
.text_box_4column_2,
.text_box_4column_3,
.text_box_4column_4,
.text_box_4column .column_inner{
	display: block;
	overflow: hidden;
	position: relative;
	width: 100% !important;
	margin-right: 0px !important;
	float: none;
}



/*2カラム、3カラム、4カラムの中に画像を配置した場合はimgにmargin-bottomを強制的に追加*/
/*また、trimやtrim_wideで囲まれている場合も同様*/
.text_box_2column_left img,
.text_box_2column_right img,
.text_box_3column_left img,
.text_box_3column_center img,
.text_box_3column_right img,
.text_box_4column_1 img,
.text_box_4column_2 img,
.text_box_4column_3 img,
.text_box_4column_4 img,

.text_box_2column .column_inner img,
.text_box_3column .column_inner img,
.text_box_4column .column_inner img,

.text_box_2column_left p.trim,
.text_box_2column_right p.trim,
.text_box_3column_left p.trim,
.text_box_3column_center p.trim,
.text_box_3column_right p.trim,
.text_box_4column_1 p.trim,
.text_box_4column_2 p.trim,
.text_box_4column_3 p.trim,
.text_box_4column_4 p.trim,

.text_box_2column .column_inner p.trim,
.text_box_3column .column_inner p.trim,
.text_box_4column .column_inner p.trim,

.text_box_2column_left p.trim_wide,
.text_box_2column_right p.trim_wide,
.text_box_3column_left p.trim_wide,
.text_box_3column_center p.trim_wide,
.text_box_3column_right p.trim_wide,
.text_box_4column_1 p.trim_wide,
.text_box_4column_2 p.trim_wide,
.text_box_4column_3 p.trim_wide,
.text_box_4column_4 p.trim_wide

.text_box_2column .column_inner p.trim_wide,
.text_box_3column .column_inner p.trim_wide,
.text_box_4column .column_inner p.trim_wide

{
	margin-bottom: 10px;
}


/* ----------リンクとダウンロードファイルのアイコン---------- */
/*aタグ用*/

/*基本リンク*/




.sp_only,
.sp_only {
	display:inline-block !important;
}

.pc_only,
.pc_only {
	display: none !important;
}

.print_only,
.print_only {
	display:none;
}

/*PCの「p」だけマージンボトム20、スマホは0*/
.pc_only_mb20,
.pc_only_mb20 {
	margin-bottom:0px !important;
}





/*--------------------------------

トップページ専用スタイル

--------------------------------*/


#bg_scroll_box{
	display: block;
    position: fixed;
    width: 100%;
    height: 20vh;
    min-height: 140px;
    bottom: 50px;
    left: 0px;
    right: 0px;
    
    background: url(../img/bg_scroll_alpha.png) repeat-x;
    background-position: left top;
    background-size: contain;
}

#bg_scroll {
	display: block;
	position: relative;
	height: 100%;
    background-image: url(../img/bg_scroll.svg);
    background-repeat: no-repeat;
    /*background-size: 150%;*/
    background-size: auto 100%;
    background-position: bottom left;
    
    transition-property: background-position;
    transition-duration: .7s;
    transition-delay: .0s;/*緩急をつける場合　例：.35s*/
    
    z-index: 9999;
    
    pointer-events: none;
    
}



/*-------------------------------- メイン写真 --------------------------------*/

#main_img_box {
	display: flex; /* 子要素をflexboxで揃える */
    flex-direction: column; /* 子要素をflexboxにより縦方向に揃える */
    justify-content: center; /* 子要素をflexboxにより中央に配置する */
    align-items: center;  /* 子要素をflexboxにより中央に配置する */
	position:relative;
	height: calc(100vh - 30vh);
	min-height: 300px;
	margin-bottom: 30vh;
	clear:both;
	float:none;
	
	/*background: url(../img/main_img_bg.jpg) no-repeat center center;
	background-size: cover;*/
}

.main_img {
	display: block;
	position: relative;
	width: 26%;
	min-width: 280px;
	padding-bottom: 45.283%;
}

.main_img img{
	display: block;
	position: fixed;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 100%;
	height: auto;
}

/*-------------------------------- googleマップ --------------------------------*/

/*googleマップ配置欄　div*/
.map_box{
	display: block;
	position: relative;
	width: calc(100% + 2.8rem + 2.8rem);
	height: auto !important;
	padding-bottom: 45vh;
	margin: 0 auto;
	margin-left: -2.8rem;
	margin-right: -2.8rem;
}

.map_box iframe,
.map_box object,
.map_box embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}



/*-------------------------------- 新北海道スタイルバナー --------------------------------*/

.hokkaido_style_box{
	display: block;
	position: relative;
	margin: 0 auto;
	text-align: center;
	padding-top: 3rem;
	padding-bottom: 5rem;
	padding-left: 2rem;
    padding-right: 2rem;
}

.hokkaido_style_box a{
	display: inline-block;
	position: relative;
	border: solid 2px #e7e7e7;
}





/*--------------------------------

DOT似顔絵メーカーのコンテンツ部分

--------------------------------*/

.contents_section_dot_nigaoe_maker{
	background-color:#000;
	padding-left: 0rem;
	padding-right: 0rem;
}


.contents_section_dot_nigaoe_maker .section_inner{
	padding:0px 20px 10px 20px;
	margin:0px 0px 20px 0px;
}

.contents_section_dot_nigaoe_maker .section_inner p{
	color:#FFF; 
}

.contents_section_dot_nigaoe_maker .section_inner .holizon640{
	clear:both;
	width:100%;
	height:1px;
	margin:30px 0 30px 0;
	border:none;
	border-top:solid 1px #cccccc;
	color:#ffffff;
	background:#ffffff;
}

.contents_section_dot_nigaoe_maker .section_inner .qanda{/*ul*/
	color:#FFF;
	list-style:none;
	margin:0 !important;
	padding:0 !important;
}

.contents_section_dot_nigaoe_maker .section_inner .qanda li{
	display:block;
	overflow:hidden;
	list-style:none;
	padding-top:15px !important;
	padding-bottom:20px !important;
	border-top:dotted 1px #FFF;
	font-size:90%;
}

.q_color{
	color:#00b7ee;
	font-size:140%;
	padding-right:5px;
}

.a_color{
	color:#e5004f;
	font-size:140%;
	padding-right:5px;
}



/*--------------------------------

ABDUCTION UFOのコンテンツ部分

--------------------------------*/

.contents_section_abduction_ufo{
	padding-left: 0rem;
	padding-right: 0rem;
	background-color:#F5E02D;
}


.contents_section_abduction_ufo .section_inner{
	padding:0px 20px 10px 20px;
	margin:0px 0px 20px 0px;
}

.contents_section_abduction_ufo .section_inner p{
	color:#000000; 
}

.contents_section_abduction_ufo .section_inner .holizon640{
	clear:both;
	width:100%;
	height:1px;
	margin:30px 0 30px 0;
	border:none;
	border-top:dotted 1px #000000;
	color:#F5E02D;
	background:#F5E02D;
}



.contents_section_abduction_ufo .section_inner .qanda{/*ul*/
	color:#000000;
	list-style:none;
	margin:0 !important;
	padding:0 !important;
}

.contents_section_abduction_ufo .section_inner .qanda li{
	display:block;
	overflow:hidden;
	list-style:none;
	padding-top:15px !important;
	padding-bottom:20px !important;
	border-top:dotted 1px #000000;
	font-size:90%;
}

.contents_section_abduction_ufo .q_color{
	color:#000000;
	font-size:140%;
	padding-right:5px;
}

.contents_section_abduction_ufo .a_color{
	color:#e5004f;
	font-size:140%;
	padding-right:5px;
}


.contents_section_abduction_ufo .coming_soon_img{
	filter:alpha(opacity=60); /*IE*/
	-moz-opacity:0.60; /*FF*/
	opacity:0.60;
}





/*--------------*/


.app_banner_box {
	display:block;
	width:100%;
	text-align:center;
	float:none;
	margin-bottom:10px;
}

.app_banner_box_left_margin {
	margin-left:0px;
}


/*--------------------------------

新北海道スタイル

--------------------------------*/

.contents_section_hokkaido_style{
	padding-left: 0rem;
	padding-right: 0rem;
}





}/*@media screen and ( max-width: 768px )ここまで*/




/*プリント用調整（PC画面をA4に最適化）*/
@page {
	/*margin: 10mm 10mm !important;*/
}/*@pageここまで*/

@media print {

	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 {
		/*zoom: 0.99;*/
	}
	
	html{
		font-size: 50%;
	}
	
	html, body{
		overflow: visible !important;
		/*zoom: 0.9;*/
	}
	
	body{
		background-color: #ffffff !important;
		width: 100% !important;
		box-sizing: border-box;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		-ms-box-sizing: border-box;
		
	}
	
	
	h1, h2, h3, h4, h5, h6 p{
	}

/* --------------------- PC：メインロゴ --------------------- */

.site-title{
	display:block;
	position:relative;
	width: auto;
	top:0;
	left:0px;
	padding: 15px 20px 15px 15px;
	background-color: #ffffff;
	border-bottom: 1px solid #e7e7e7;
	border-right: 0px solid #e7e7e7;
	
	z-index: 9999;
}

.frontpage .site-title{
	display: none;
}	

/*------------------------------

フッター

------------------------------*/

#footer{
	display: block;
	position:relative;
	bottom: 0px;
	left: 0px;
	right: 0px;
	height: 50px;
	margin: 0 auto ;
	text-align:center;
	background-color: #ffffff;
	clear:both;
}

/* ----------ページTOPへボタン---------- */
#pagetop_wrapper {
	display: none;
}	
	
#bg_scroll_box{
	display: block;
    position: relative;
    width: 100%;
    height: 160px;
    min-height: 140px;
    bottom: 50px;
    left: 0px;
    right: 0px;
    
    background: url(../img/bg_scroll_alpha.png) repeat-x;
    background-position: left top;
    background-size: contain;
}


/*パララックス*/
.animation_1,
.animation_2,
.animation_3,
.fadeInUp,
.fadeIn,
.fadeInBlur,
.fadeInBlur_For3sec,
.slideShutter{
	display: block;
	opacity: 1 !important;
}

.slideShutter:after{
	display: none;
}



/* -------------------------------- 

 レイアウト設定
 
-------------------------------- */

div#contents_all {
    padding-top: 20px;
    margin-bottom: 60px;
}


div#contents_main{
	display: block;
	position: relative;
	max-width: 100%;
	margin: 0 auto;
}

/* ----------パンくずリスト全体の設定---------- */

div.topicpath {
	display: block;
	width: 100%;
	margin: 0px auto 0px auto;
	padding-left: 0rem;
	padding-right: 0rem;
	text-align: left;
	clear: both;

	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-ms-box-sizing: border-box;
}


/*------------------------------

各パーツ設定

------------------------------*/

/*各段落のタイトル欄　div*/
.section_title_box{
	display: block;
	position: relative;
	padding-left: 0rem;
	padding-right: 0rem;
	margin-bottom: 0rem;
	
}

.section_title_box h1{
	font-size: 3.8rem;
	font-weight: 300;
}

.section_title_box h1 b{
	display: none;
}

.section_content_box{
	display: block;
	position: relative;
	padding-left: 0rem;
	padding-right: 0rem;
	padding-bottom: 0rem;
}

.text_delay_animation{
	 opacity: 1; margin-left:0rem;
}



/*-------------------------------- メイン写真 --------------------------------*/

#main_img_box {
	display: flex; /* 子要素をflexboxで揃える */
    flex-direction: column; /* 子要素をflexboxにより縦方向に揃える */
    justify-content: center; /* 子要素をflexboxにより中央に配置する */
    align-items: center;  /* 子要素をflexboxにより中央に配置する */
	position:relative;
	height: 400px;;
	min-height: 300px;
	margin-bottom: 0vh;
	clear:both;
	float:none;
	
	/*background: url(../img/main_img_bg.jpg) no-repeat center center;
	background-size: cover;*/
}

.main_img {
	display: block;
	position: relative;
	width: 26%;
	min-width: 320px;
	padding-bottom: 45.283%;
}


/*--------------------------------

DOT似顔絵メーカーのコンテンツ部分

--------------------------------*/


.contents_section_dot_nigaoe_maker{
	background-color:#000;
	max-width: 100%;
	margin: 0 auto;
}


/*--------------------------------

ABDUCTION UFOのコンテンツ部分

--------------------------------*/

.contents_section_abduction_ufo{
	background-color:#F5E02D;
	
	max-width: 100%;
	margin: 0 auto;
}

/*--------------------------------

新北海道スタイル

--------------------------------*/

.contents_section_hokkaido_style{
	max-width: 100%;
	margin: 0 auto;
}



}/*@media printここまで*/