@charset "utf-8";


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

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

body{
color:#333;
font-family: "Noto Sans JP", sans-serif;
font-weight: 400;
line-height:1.7;
background:#e2e2e2;
-webkit-text-size-adjust: none;
}

html{background:#e2e2e2;}


/* リンク設定
------------------------------------------------------------*/
a{color:#656565;}

a:active, a:focus{outline:0;}


/* 全体
------------------------------------------------------------*/
#wrapper{
margin:0 auto;
padding:0 1%;
width:98%;
position:relative;
background:#ffffff;
}

.inner{
margin:0 auto;
width:100%;
}


/*************
/* ヘッダー
*************/
h1{
font-size:10px;
line-height:1.6;
font-weight:normal;
}

#header{
	overflow:hidden;
	padding:5px 0;
	width:100%;
	background:#ffffff;
}

* html #header{height:1%;}


/*************
/* ロゴ
*************/
#header .logo{
float:left;
padding:25px 0 0;
}

.logo a{
font-size:16px;
font-weight:bold;
line-height:1;
color:#333;
text-decoration:none;
}

.logo span{
font-size:10px;
font-weight:normal;
color:#333;
}

.info{
float:right;
padding:40px 20px 0 0;
}

.tel strong{
font-size:16px;
font-weight:bold;
}




/**************************
/* メイン画像（トップページ+サブページ）
**************************/
#mainBanner{
	max-width:100%;
padding:4px;
position:relative;
line-height:0;
background:#d7d7d7;
}

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

.slogan{
position:absolute;
max-width:100%;
height:auto;
top:10px;
left:10px;
padding:10px 15px;
line-height:1.4;
z-index:100;

}

.slogan h2{
	font-family: "Zen Antique", serif;
	font-weight: 900;
	font-style: normal;
	padding-bottom:5px;
	font-size:min(1.0vw,70px);
	color:#004ea2;
	text-shadow:
    2px 2px 0 #FFF,
    -2px 2px 0 #FFF,
    -2px -2px 0 #FFF,
    2px -2px 0 #FFF;
}

.slogan h3{
	font-size:min(2.5vw,25px);
	color:#004ea2;
	text-shadow:
    2px 2px 0 #FFF,
    -2px 2px 0 #FFF,
    -2px -2px 0 #FFF,
    2px -2px 0 #FFF;
}

.marker {
  background:linear-gradient(90deg, #a6d1ff 0%, rgba(255,255,255,1) 100%);
  display: inline;

  /* 背景の繰り返しを停止 */
  background-repeat: no-repeat;

  /* マーカーの横方向を0にして縮める */
  background-size: 0% 100%;

  /* マーカーが引かれる速度を指定 */
  transition:background-size 1.5s;
}

/* マーカーが引かれる際に付与するクラス */
.marker.on {
  /* 横方向を100%にして、マーカーを引く */
  background-size: 100% 100%;
}

/**************************
/* グリッド
**************************/
.gridWrapper{
clear:both;
padding:20px 0;
overflow:hidden;
}

* html .gridWrapper{height:1%;}
	
.grid{
	float:left;
}

.colDark,.colLight{
padding-bottom:5px;
color:#fff;
background:#1c1c1c;
}

.colLight{background:#005c98;}

.colDark h3,.colLight h3{
margin:10px 10px 5px;
font-size:14px;
font-weight:bold;
}

.colDark a,.colLight a{
display:block;
padding:3px;
border-radius:3px;
color:#fff;
background:#005c98;
}

.colLight a{background:#1c1c1c;}

.colLight a:hover,.colDark a:hover{
color:#1c1c1c;
background:#fff;
}

h3{
	padding-left:7px;
	margin-bottom:17px;
	font-size:1.5rem;
	font-weight: 600;
	border-left:4px solid #004ea2;
	width:100%;
	float:left;
}

.grid p{
padding:5px 10px;
}

.grid ul{margin:5px 10px;}

.grid li{
padding:5px 0;
list-style:inside;
border-bottom:1px dashed #d7d7d7;
}

.grid li a{
text-decoration:none;
}

li.Pagination-Item{
	border-bottom:none;
}

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

/* フッター内のグリッド(3カラム) */
#footer .grid{
background:transparent;
}

#footer .col3 ul{margin:0 0 10px 5px;}

#footer .col3 li{
padding:0 6px 0 5px;
margin-bottom:3px;
list-style:none;
border-bottom:0;
display:inline-block;
border-right:1px solid #d7d7d7;
}


/*************
メイン コンテンツ
*************/
section.content{
margin-bottom:20px;
overflow:hidden;
}

* html section.content{height:1%;}

section.content p{margin-bottom:5px;}

h3.heading{
padding-left:7px;
margin-bottom:17px;
font-size:14px;
border-left:4px solid #d7d7d7;
}

.alignleft{
float:left;
clear:left;
margin:3px 10px 10px 1px;
}

.alignright{
float:right;
clear:right;
margin:3px 1px 10px 10px;
}

img.frame,#gallery img{
border:4px solid #fff;
box-shadow:0 0 2px rgba(0, 0, 0, 0.5);
-webkit-box-shadow:0 0 2px rgba(0, 0, 0, 0.5);
}

#gallery .gridWrapper{padding:0;}

#gallery img{
margin:5px;
}

section#gallery{overflow:visible;}



/*************
/* フッター
*************/
#footer{
clear:both;
padding:10px 0 40px 0;
overflow:hidden;
font-size:11px;
}

* html #footer{height:1%;}

#footer .copyright{
	text-align: center;
	margin-top:20px;
	margin-bottom:20px;
	font-size:12px;
}

.grid,.col2,.col3{
	margin:2%;
}
.footerlogo{
	width: 250px;
}

.footergrid1{
	float: left;
}
.footergrid2{
	float: right;
}
.footergrid2 ul{
	margin-top:15px;
	display: flex;
}
.footergrid2 ul li{
	width:150px;
	font-size: 13px;
}
.footergrid2 ul li a{
	color:#004ea2;
	text-decoration: none;
}
.five{
	clear:both;
	width:100%;
	height: auto;
	display: flex;
	-webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    padding:0 50px;
}
.fiveContent{
	width:calc(100%/4);
	text-align: center;
	font-size: 0.85rem;
}
.big{
	font-size: 1rem;
	font-weight: bold;
}

.clear{
	clear:both;
}

/*************
/* グリッド30
*************/
.col30 {
	margin: 1em;
	background: #f1f1f1;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.22);
	text-align: center;
	justify-content: center;
	-webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}
.box-title {
    font-size: 0.9rem;
    background: #004ea2;
    padding: 10px 5px;
    text-align: center;
    color: #FFF;
    font-weight: bold;
    letter-spacing: 0.05em;
    height: auto;
}
.box-title a{
	color: #FFF;
}
.box-title a:hover {
    color: #FFFF00;
}

.col30 img {
    padding: 0;
    margin: auto;
}


.col50{
	text-align: center;
}
.col50 img{
	width:100%;
	margin: 0 auto;
}



/* メールフォーム
---------------------------------------------*/
.mailform {
  width:100%;
  padding:20px 20px;
}
.mailform div {
  padding: 10px 20px;
}

input.submit {
  display:block;
  margin:0 200px;
}
.labelmail {
  display:block;
  float:left;
  width:200px;
  margin: 0 20%;
}
.mail {
  background:#b22222;
  padding:4px 4px;
  font-size:12px;
  color:#fff;
  margin-right:10px;
}
input[type="text"]{
	padding: 10px 15px; /*ボックスを大きくする*/
    font-size: 16px;
    border-radius: 3px; /*ボックス角の丸み*/
    border: 2px solid #ddd; /*枠線*/
    box-sizing: border-box; /*横幅の解釈をpadding, borderまでとする*/
}
input[type="email"]{
    padding: 10px 15px; /*ボックスを大きくする*/
    font-size: 16px;
    border-radius: 3px; /*ボックス角の丸み*/
    border: 2px solid #ddd; /*枠線*/
    box-sizing: border-box; /*横幅の解釈をpadding, borderまでとする*/
}
.text{
	margin:0 20%;
	width:60%;
}
@supports (-ms-ime-align:auto) {
	input[type="text"]{
		padding-top:20px;	
	}
	input[type="email"]{
		padding-top:20px;	
	}
}
form textarea {
	resize: vertical;
	padding: 10px 15px; /*ボックスを大きくする*/
	font-size: 16px;
    border-radius: 3px; /*ボックス角の丸み*/
    border: 2px solid #ddd; /*枠線*/
    box-sizing: border-box; /*横幅の解釈をpadding, borderまでとする*/
}
input::placeholder {
  color: #dcdcdc;
}

/* IE */
input:-ms-input-placeholder {
  color: #dcdcdc;
}

/* Edge */
input::-ms-input-placeholder {
  color: #dcdcdc;
}
.button {
  display       : inline-block;
  border-radius : 5%;          /* 角丸       */
  font-size     : 12pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 12px 40px;   /* 余白       */
  background    : #1a78eb;     /* 背景色     */
  color         : #ffffff;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .2s;         /* なめらか変化 */
  box-shadow    : 3px 3px 3px #666666;  /* 影の設定 */
  border        : 2px solid #000066;    /* 枠の指定 */
  text-align:center;
}
.button:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #000066;     /* 背景色     */
  background    : #ffffff;     /* 文字色     */
}

.butt {
	text-align:center;
}

.imageSp{
	width: 100%;
	margin: 0 auto;
	text-align: center;
}
.centerImg{
	width: 700px;
	margin: 0 auto;
}

.sup{
	vertical-align: super;
	font-size: 0.8rem;
}



.btn01{
    display: block;
    width: 200px;
    padding: 15px 0;
    margin: auto;
    background: #004ea2;
    color: #FFF;
    text-decoration: none;
    text-align: center;
}
.btn01:hover{
    background: #002f62;
}


.kouhou{
	clear:both;
	display: flex;
	width: 100%;
	-webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}
.kouh30{
	margin: 1%;
	padding: 1%;
	background: #eeeeee;
	width:calc(100%/3.2);
	text-align: center;
	 border-radius: 10px;
}
.kouh30 p{
	margin: 0 auto;
	text-align: left;
}
.search {
    width: 100%;
}
.searchform1 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    overflow: hidden;
    border-radius: 10px;
    width: 100%;
    margin-bottom: 10px;
}
.searchform1 button {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 70px;
    border: none;
    background-color: #002f62;
    cursor: pointer;
    border-radius: 0 10px 10px 0;
}
.keywords {
    display: block;
    width: 100%;
    height: 70px;
    font-size: 1.2rem;
    padding: 10px;
    border-radius: 10px 0 0 10px;
    border: 1px solid #004ea2;
}
.searchform1 button::after {
    width: 24px;
    height: 24px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18.031 16.6168L22.3137 20.8995L20.8995 22.3137L16.6168 18.031C15.0769 19.263 13.124 20 11 20C6.032 20 2 15.968 2 11C2 6.032 6.032 2 11 2C15.968 2 20 6.032 20 11C20 13.124 19.263 15.0769 18.031 16.6168ZM16.0247 15.8748C17.2475 14.6146 18 12.8956 18 11C18 7.1325 14.8675 4 11 4C7.1325 4 4 7.1325 4 11C4 14.8675 7.1325 18 11 18C12.8956 18 14.6146 17.2475 15.8748 16.0247L16.0247 15.8748Z' fill='%23fff'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    content: '';
}

/*ページネイション
---------------------------------------------------------------------------*/
.Pagination {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap : wrap;
	width:100%;
	padding:0px 10px;
	margin:10px auto;
	text-aling:center;
}
.Pagination-Item {
	list-style:none !important;
}
.Pagination-Item-Link {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	overflow: hidden;
	background: #fff;
	border: solid 1px #004ea2;
	font-size: 11px;
	color: #004ea2;
	font-weight: bold;
	transition: all 0.15s linear;
	text-decoration:none;
}
.Pagination-Item-Link-Icon {
	width: 20px;
}
.Pagination-Item-Link.isActive {
	background: #004ea2;
	color: #fff;
	pointer-events: none;
}
.Pagination-Item-Link:not(.isActive):hover {
	background: #004ea2;
	color: #fff;
}
.Pagination > * + * {
	margin:5px 2px;
}


.juusyo {
	text-indent: -1em;
	padding-left: 2em;
}
.clear{
	clear:both;	
	width:100%;
	margin:5px 0;
}


.sortBtn {
    display: flex;
    margin-top: 0;
    height: auto;
}
.typeA {
    font-family: 'ZenMaruGothic-Regular', sans-serif;
    background-color: #6aa1dc;
    color: var(--text-color);
    margin: 3px 0;
    border-radius: 3px 3px 3px 3px;
    border: none;
    padding: 5px 10px;
    font-size: 1.0rem;
    cursor: pointer;
}

.typeB {
    font-family: 'ZenMaruGothic-Regular', sans-serif;
    background-color: #6adc79;
    color: var(--text-color);
    margin: 3px 0;
    border-radius: 3px 3px 3px 3px;
    border: none;
    padding: 5px 10px;
    font-size: 1.0rem;
    cursor: pointer;
}
.typeC {
    font-family: 'ZenMaruGothic-Regular', sans-serif;
    background-color: #756adc;
    color: var(--text-color);
    margin: 3px 0;
    border-radius: 3px 3px 3px 3px;
    border: none;
    padding: 5px 10px;
    font-size: 1.0rem;
    cursor: pointer;
}
.typeD {
    font-family: 'ZenMaruGothic-Regular', sans-serif;
    background-color: #dc6acb;
    color: var(--text-color);
    margin: 3px 0;
    border-radius: 3px 3px 3px 3px;
    border: none;
    padding: 5px 10px;
    font-size: 1.0rem;
    cursor: pointer;
}


/************* 応募フォーム *******************/
.ouboForm{
	width:100%;
	margin: 0 auto;
	text-align: center;
}
.oubo{
	width:100%;
	text-align: left;
}
.oubo2{
	width:100%;
	height: 120px;
	text-align: left;
}
.ouboBtn{
	background: #004ea2;
	padding: 10px 40px;
	color:#ffffff;
	margin: 20px;
}
.right{
	float:right;
}
.right:hover{
	color:red;
}




/*モーダル
---------------------------------------------------------------------------*/
.modalArea {
  display: block;
  position: fixed;
  z-index: 100; /*サイトによってここの数値は調整 */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.modalBg {
  width: 100%;
  height: 100%;
  background-color: rgba(30,30,30,0.9);
}

.modalWrapper {
  position: absolute;
  top: 50%;
  left: 50%;
  transform:translate(-50%,-50%);
  width: 70%;
  max-width: 500px;
  padding: 10px 10px;
  background-color: #fff;
}

.closeModal {
  position: absolute;
  top: 0.5rem;
  right: 1rem;
  cursor: pointer;
}


/* 以下ボタンスタイル */
button {
  padding: 10px;
  background-color: #fff;
  border: 1px solid #282828;
  border-radius: 2px;
  cursor: pointer;
}

#openModal {
  position: absolute;
  top: 50%;
  left: 50%;
  transform:translate(-50%,-50%);
}




.kawarah1{
	margin:0;
}
form.gazou {
    width: 100%;
    height: auto;
    padding: 20px;
    text-align: center;
}
 
.upload-area {
    margin: auto;
    width: 85%;
    height: 150px;
    position: relative;
    border: 1px dotted rgba(0, 0, 0, .4);
    display: flex;
  justify-content: center;
  align-items: center;
}
.upload-area i {
    position: absolute;
    font-size: 70px;
    opacity: .1;
    width: 100%;
    left: 0;
    top: 10px;
}
.upload-area p {
    width: 100%;
    position: absolute;
    top: 120px;
    right:10px;
    opacity: .8;
}

.area2upload {
    margin: auto;
    width: 85%;
    height: 150px;
    position: relative;
    border: 1px dotted rgba(0, 0, 0, .4);
    display: flex;
  justify-content: center;
  align-items: center;
}
.area2upload i {
    position: absolute;
    font-size: 70px;
    opacity: .1;
    width: 100%;
    left: 0;
    top: 10px;
}
.area2upload p {
    width: 100%;
    position: absolute;
    top: 50px;
    opacity: .8;
}


.upup3area {
    margin: auto;
    width: 85%;
    height: 150px;
    position: relative;
    border: 1px dotted rgba(0, 0, 0, .4);
    display: flex;
  justify-content: center;
  align-items: center;
}
.upup3area i {
    position: absolute;
    font-size: 70px;
    opacity: .1;
    width: 100%;
    left: 0;
    top: 10px;
}
.upup3area p {
    width: 100%;
    position: absolute;
    top: 50px;
    opacity: .8;
}

.aten{
	font-size:14px;
	line-height:1.3;
	margin-bottom:10px;
	color:#999;
}
#input-files {
    top: 0;
    left: 0;
    opacity: 0;
    position: absolute;
    width: 100%;
    height: 100%;
}
 
#submit-btn {
    font-weight: bold;
    margin-top: 20px;
    border-radius: 3px;
    width: 200px;
    height: 45px;
    background-color: rgba(108, 168, 255, .7);
    border: none;
    box-shadow: 0 5px 0 rgba(0, 0, 0, 0.6);
    opacity: .6;
    cursor: pointer;
}
#submit-btn:hover {
    background-color: rgba(108, 168, 255, 1.0);
}
#submit-btn:active {
    position: relative;
    top: 5px;
    box-shadow: none;
}
.title{
	margin-bottom:10px;
	padding:5px;
	font-size:18px;
	width:80%;
	height:40px;
}
.cloud {
	opacity: 0.3;
}
#upload_file {
	display: block;
	margin: 0 auto;
}
	
	
/*テーブル
---------------------------------------------------------------------------*/
.ta1 {
	margin-top:20px; 
    table-layout: fixed;
    border-top: 1px solid #333;
    width: 100%;
    margin-bottom: 5rem;
    text-align: center;
}
.ta1 th{
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;
	background: #e5e5e5;
	padding:10px;
	text-align: center;
}
.ta1 tr{
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;
}
.ta1 td{
	text-align: center;
	padding:10px;
}
.ta1 td a:hover{
	color:red;
}


/*パンくず
---------------------------------------------------------------------------*/
.pan {
    background-color: #fff;
}
.breadcrumb {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
}
.breadcrumb li:not(:last-of-type)::after {
    content: "»";
    margin: 0 .6em;
    color: #777;
}


/*お知らせ
---------------------------------------------------------------------------*/
.box26 {
    position: relative;
    padding:1em;
    border-top: solid 5px #004ea2;
    border-bottom: solid 5px #004ea2;
    overflow: auto;
}
.box26 .box-title {
    margin-top: 10px;
    display: inline-block;
    padding: 0 9px;
    line-height: 1;
    font-size: 25px;
    background: #FFF;
    color: #004ea2;
    font-weight: bold;
    z-index: 10;
}
.box26 a:hover {
    color: #004ea2;
}

.osirase li{
	padding:15px;
	border-bottom:1px dotted #004ea2;
	align-items: center;
}

.nitiji{
	margin-right: 20px;
}
.blogCateB{
	margin-right: 20px;
	background: #004ea2;
	color:#fff;
	padding:5px 10px;
	border-radius:3px;
	text-align: center;
}
.blogCateR{
	margin-right: 20px;
	background: #de0000;
	color:#fff;
	padding:5px 10px;
	border-radius:3px;
	text-align: center;
}
.blogCateG{
	margin-right: 20px;
	background: gray;
	color:#fff;
	padding:5px 10px;
	border-radius:3px;
	text-align: center;
}


.aisatu{
	margin:2rem;
}
.aisatu p{
	margin:20px;	
}
.txtright{
	margin:30px;
	text-align: right;
}

.col100 p{
	padding:10px 0;
}

.btn02 {
    display: block;
    width: 150px;
    padding: 15px 0;
    margin: 15px;
    background: #004ea2;
    color: #FFF;
    text-decoration: none;
    text-align: center;
    float: right;
}
/*インタビュー
---------------------------------------------------------------------------*/
.name{
	font-size: 20px;
	font-weight: 800;
	margin-left: 10px;
	border-bottom: 1px solid #cdcdcd;
}
.intav{
	display:flex;
	width:100%;
	margin-bottom: 20px;
}
.senpaiTxt{
	width:60%;
	padding:10px;
}
.senpaiPhoto{
	width:40%;
	padding:10px;
}
.bggray{
	background: #e9e9e9;
}


/*スマホ画面のトップタイトル変更
---------------------------------------------------------------------------*/
.h2big{
	font-size: 1.5rem;
	margin: 20px 10px;
	font-weight: bold;
	color:#004ea2;
	font-family: "Zen Antique", serif;
}
.h2small{
	font-size: 1rem;
	margin: 15px 10px;
	font-weight: bold;
	line-height: 1.4;
	color:#000;
	font-family: "Zen Antique", serif;
}


#sakujo {
    font-weight: bold;
    margin-top: 20px;
    border-radius: 3px;
    width: 100px;
    height: 45px;
    background-color: rgba(108, 168, 255, .7);
    border: none;
    box-shadow: 0 5px 0 rgba(0, 0, 0, 0.6);
    opacity: .6;
    cursor: pointer;
}
.attach-file{
	
}

/*ギャラリー
---------------------------------------------------------------------------*/
.garh2{
	font-size: 30px;
	font-weight: bold;
	margin: 30px 0;
}
#lightgallery{
	display: flex;
	flex-wrap: wrap;
	max-width: 1200px; /*最大の幅*/
	margin: 0 auto;
}

#lightgallery a{
	flex: 1 1 300px; /*１つの記事の大きさ*/
	text-decoration: none;
	margin: 0;
	padding: 0;
	position: relative;
	overflow: hidden;
	padding-top: 25%; /* 比率 */
}

#lightgallery img{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.moveDiv{
	width:100%;
	text-align: center;
	margin: 0 auto;
}
.move{
	width:80%;
}
.dimidi{
	margin: 30px; 0;
}

.kijihen{
	word-break: break-all;
}




/*アコーディオン
---------------------------------------------------------------------------*/
.toggle {
	display: none;
}
.Label {		/*タイトル*/
	padding: 1em;
	display: block;
	color: #fff;
	background:#004ea2;
	font-size:1.4rem;
	text-align: center;
}
.Label::before{		/*タイトル横の矢印*/
	content:"";
	width: 6px;
	height: 6px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	-webkit-transform: rotate(45deg);
	position: absolute;
	top:calc( 50% - 3px );
	right: 20px;
	transform: rotate(135deg);
}
.Label,
.content {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transform: translateZ(0);
	transition: all 0.3s;
}
.content {		/*本文*/
	height: 0;
	margin-bottom:10px;
	padding:0 0px;
	overflow: hidden;
}
.toggle:checked + .Label + .content {	/*開閉時*/
	height: auto;
	padding:0px ;
	transition: all .3s;
}
.toggle:checked + .Label::before {
	transform: rotate(-45deg) !important;
}


.linkBox {
  display: flex; /* Flexbox を有効にする */
  flex-direction: row; /* 子要素を横方向に並べる（デフォルト） */
  justify-content: space-between; /* 要素間のスペースを均等に配置（左右端は親要素に揃う） */
  /* justify-content: space-around; /* 要素間のスペースと左右端のスペースを均等に配置 */
  /* justify-content: flex-start; /* 左寄せで並べる */
  /* justify-content: center; /* 中央寄せで並べる */
  height: 60px;
  width:100%;
  padding:0 10%;
}

.linkBox p {
  margin: 0; /* デフォルトの上下マージンをリセット */
  width:100%;
}

.linkBox a.btn10 {

/* ボタンのスタイル（必要に応じて調整） */
  display: inline-block; /* インライン要素をブロックレベルのように扱う（widthやheightが適用可能に） */
  padding: 10px 20px;
  text-decoration: none;
  background-color: #004ea2;
  color: #fff;
  border-radius: 5px;
  /* 必要に応じて幅を指定 */
   width: 100%;
   height:50px;
  text-align: center; /* テキストを中央揃えにする場合 */
}

.linkBox02 {
  display: flex; /* Flexbox を有効にする */
  flex-direction: row; /* 子要素を横方向に並べる（デフォルト） */
  justify-content: space-between; /* 要素間のスペースを均等に配置（左右端は親要素に揃う） */
  /* justify-content: space-around; /* 要素間のスペースと左右端のスペースを均等に配置 */
  /* justify-content: flex-start; /* 左寄せで並べる */
  justify-content: center;
  height: 60px;
  width:100%;
  padding:0 10%;
}

.linkBox02 p {
  margin: 0; /* デフォルトの上下マージンをリセット */
   width:100%;
}

.linkBox02 a.btn20 {

  /* ボタンのスタイル（必要に応じて調整） */
  display: inline-block; /* インライン要素をブロックレベルのように扱う（widthやheightが適用可能に） */
  padding: 10px 20px;
  text-decoration: none;
  background-color: #004ea2;
  color: #fff;
  border-radius: 5px;
  /* 必要に応じて幅を指定 */
   width: 100%;
   height:50px;
  text-align: center; /* テキストを中央揃えにする場合 */
}

sup {
  vertical-align: super;
  font-size: smaller; /* 通常より小さくすることが一般的 */
  position: relative;
  top: -0.1em; /* 上に移動させる量 */
  font-size: 0.6rem;
}

/* PC用 */
@media only screen and (min-width:1200px){	
	#header{
		margin: 0 auto;
		width:1200px;
		padding:0 20px;
	}
	.slogan h2{
		font-size:70px !important;
	}
	#wrapper,.inner{
	width:1200px;
	padding:0 20px;
	}
		
	#wrapper{
		margin: 0 auto;
		padding-bottom:20px;
	}
	
	#main{
	float:right;
	width:1200px;
	margin-top:20px;
	}
	
	.logo img{
		width:350px;
	}
	
	#subpage #sub{
	float:left;
	width:235px;
	overflow:hidden;
	margin-top:20px;
	}
	
	/* グリッド */
	.grid{width:20%;}
	.col2{width:46%;}
	.col3{width:96%;}
	.col56{width:56%;}
	.col36{width:36%;}
	.col98{width:98%;}
	.col30{width:calc(100%/3.4)}
	.col50{width:calc(100%/2.2)}
	#gallery .grid{width:230px;}
	#subpage #sub .grid{
	width:100%;
	float:none;
	padding-bottom:30px;
	-webkit-flex-wrap: wrap;
    flex-wrap: wrap;
	}
	
	.footergrid1{
		width:35%;
	}
	.footergrid2{
		width:60%;
	}
	.col100{
		margin:5rem;
	}
	.box26 {
	    margin: 2em;
	}
	.osirase{
		margin-left: 40px;
		margin-right: 40px;
	}
	.osirase li{
		display: flex;
	}
	.nitiji{
		width:15%;
	}
	.blogCateB{
		width:15%;
	}
	.blogCateR{
		width:15%;
	}
	.blogCateG{
		width:15%;
	}
	.blogtitle{
		width:55%;
		word-break: break-all;
	}

}


/* モニター幅1200px以下 */
@media only screen and (max-width:1200px){
	
	h1 p.inner{padding:0 2%;width:96%}
	#header .logo{padding-left:10px;}
	#header .info{padding-right:10px;}
	#header {
		padding:0 2%;
		width:98%;
		margin: 0 auto;
	}
	ul#top#gnav{
		clear:both;
		width:100%;
	}
	.slogan h2{
		font-size:60px !important;
	}
	ul#topnav li{
		width:33%;
		margin:0 0 5px;
		border-right:1px solid #1c1c1c;
		 box-sizing:border-box;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
	}
	
	.logo img{
		width:300px;
	}
	
	ul#topnav li:nth-child(3n){border-right:0;width:34%;}

	ul#topnav li a{
		width:100%;
		border-top:0;
	}

	ul#topnav li:first-child a,ul#topnav li:last-child a{width:100%;}
	
	/* グリッド */
	.grid{width:20%;}
	.col2{width:46%;}
	.col3{width:96%;}
	.col56{width:56%;}
	.col36{width:36%;}
	.col98{width:98%;}
	.col50{width:calc(100%/2.2)}
	.col30{width:calc(100%/3.5)}
	.col2{
		float:none;
		width:100%;
		margin:0 0 20px;
	}
	

	
	#gallery .grid{
	width:31%;
	margin:0 1%;
	padding:0;
	}
	
	#gallery .grid img{
	float:none;
	}
	
	section.content{padding:0 10px;}
	
	section.content img{
  max-width:90%;
	height:auto;
	}
	
	#sub .grid{padding-bottom:20px;}
	
	#footer{padding:0;}
	
	#footer .grid{
	float:none;
	width:100%;
	margin-bottom:5px;
	text-align:center;
	}
	
	.footergrid1{
		width:35%;
	}
	.footergrid2{
		width:60%;
	}
	.col100{
		margin:4rem;
	}
	.box26 {
	    margin: 2em;
	}
	.osirase{
		margin-left: 40px;
		margin-right: 40px;
	}
	.osirase li{
		display: flex;
	}
	.nitiji{
		width:20%;
	}
	.blogCateB{
		width:20%;
	}
	.blogCateR{
		width:20%;
	}
	.blogCateG{
		width:20%;
	}
	.blogtitle{
		width:55%;
		word-break: break-all;
	}
	.linkBox {
		padding:0;
	}
	.linkBox02 {
		padding:0 10%;
	}


}


/* iPad 縦 */
@media only screen and (max-width:768px){
  #header{padding:3px;}	
	#mainBanner{padding:3px;}
	
	.slogan h2{
		font-size:40px !important;
	}
	/* グリッド */
	.grid{width:20%;}
	.col2{width:46%;}
	.col3{width:96%;}
	.col56{width:54%;}
	.col36{width:34%;}
	.col98{width:98%;}
	.col30{width:calc(100%/3.6)}
	.col50{width:98%;}
	.col2{
		float:none;
		width:100%;
		margin:0 0 20px;
	}
	.col100{
		margin:3rem;
	}
	.intav{
		display:block;
		width:100%;
	}
	.senpaiTxt{
		width:100%;
		padding:10px;
	}
	.senpaiPhoto{
		width:100%;
		padding:10px;
	}
	.box26 {
	    margin: 2em;
	}
	.osirase{
		margin-left: 40px;
		margin-right: 40px;
	}
	.osirase li{
		display: flex;
	}
	.nitiji{
		width:20%;
	}
	.blogCateB{
		width:20%;
	}
	.blogCateR{
		width:20%;
	}
	.blogCateG{
		width:20%;
	}
	.blogtitle{
		width:55%;
		word-break: break-all;
	}
	#lightgallery a{
		flex: 1 1 33%; /*１つの記事の大きさ*/
	}
	.linkBox {
		margin-top: 50px;
		display: block; /* Flexbox を有効にする */
		flex-direction: row; /* 子要素を横方向に並べる（デフォルト） */
		justify-content: space-between; /* 要素間のスペースを均等に配置（左右端は親要素に揃う） */
		/* justify-content: space-around; /* 要素間のスペースと左右端のスペースを均等に配置 */
		/* justify-content: flex-start; /* 左寄せで並べる */
		/* justify-content: center; /* 中央寄せで並べる */
		height: 180px;
		width:100%;
		padding:0 10%;
	}
	.linkBox .btn10 {
	   width: 80%;
	   height: 60px;
	}
	.linkBox02 {
		margin-top: 50px;
		display: block; /* Flexbox を有効にする */
		flex-direction: row; /* 子要素を横方向に並べる（デフォルト） */
		justify-content: space-between; /* 要素間のスペースを均等に配置（左右端は親要素に揃う） */
		/* justify-content: space-around; /* 要素間のスペースと左右端のスペースを均等に配置 */
		/* justify-content: flex-start; /* 左寄せで並べる */
		/* justify-content: center; /* 中央寄せで並べる */
		height: 130px;
		width:100%;
		padding:0 10%;
	}
	.linkBox .btn20 {
	   width: 80%;
	   height: 60px;
	}
}


/* スマートフォン 横(ランドスケープ) */
@media only screen and (max-width:690px){
	.grid{width:100%;}
	.slogan h2{
		font-size:25px !important;
	}
	.grid img{
	float:none;
	margin:20px auto 10px;
	}
	#header .logo{
		clear:both;
	}
	.logo img{
		width:250px;
	}
	.inner{
		margin: 0 auto;
		text-align: center;
	}
	.logo{
		margin-left: auto;
		margin-right: auto;
		margin:0;
	}

	.grid p{text-align:left;}
	
	img.frame,#gallery img{border-width:2px;}

  .alignleft,.alignright{
	float:none;
	display:block;
	margin:0 auto 10px;
	}
	
	.text{
		margin:0;
		width:100%;
	}
	.labelmail {
	  width:200px;
	  margin: 0;
	}
    
    .col56{width:96%;}
    .col36{width:96%;}
	.col30{
		margin: 0.5em;
		width:45%;
	}
	
	.info{
		display: none;
	}
	
	#footer .grid p{text-align:center;}
	.footergrid1{
		width:100%;
	}
	.footergrid1 .footerlogo{
		margin: 0 auto;
	}
	.footergrid2{
		display: none;
	}
	.fiveContent{
		width:50%;
		text-align: center;
		margin:10px 0;
	}
	.kouh30{
		width:calc(100%/2.09);
	}
	.col100{
		margin:2rem;
	}
	.intav{
		display:block;
		width:100%;
	}
	.senpaiTxt{
		width:100%;
		padding:10px;
	}
	.senpaiPhoto{
		width:100%;
		padding:10px;
	}
	.box26 {
	    margin: 1em;
	}
	.osirase{
		margin-left: 20px;
		margin-right: 20px;
	}
	.osirase li{
		display: block;
	}
	.nitiji{
		margin-top:5px; 
		float: left;
		width:35%;
	}
	.blogCateB{
		float: right;
		width:50%;
	}
	.blogCateR{
		float: right;
		width:50%;
	}
	.blogCateG{
		float: right;
		width:50%;
	}
	.blogtitle{
		margin-top:45px; 
		width:100%;
		word-break: break-all;
	}
	.linkBox {
		margin-top: 50px;
		display: block; /* Flexbox を有効にする */
		flex-direction: row; /* 子要素を横方向に並べる（デフォルト） */
		justify-content: space-between; /* 要素間のスペースを均等に配置（左右端は親要素に揃う） */
		/* justify-content: space-around; /* 要素間のスペースと左右端のスペースを均等に配置 */
		/* justify-content: flex-start; /* 左寄せで並べる */
		/* justify-content: center; /* 中央寄せで並べる */
		height: 180px;
		width:100%;
		padding:0 10%;
	}
	.linkBox .btn10 {
	   width: 80%;
	   height: 60px;
	}
	.linkBox02 {
		margin-top: 50px;
		display: block; /* Flexbox を有効にする */
		flex-direction: row; /* 子要素を横方向に並べる（デフォルト） */
		justify-content: space-between; /* 要素間のスペースを均等に配置（左右端は親要素に揃う） */
		/* justify-content: space-around; /* 要素間のスペースと左右端のスペースを均等に配置 */
		/* justify-content: flex-start; /* 左寄せで並べる */
		/* justify-content: center; /* 中央寄せで並べる */
		height: 130px;
		width:100%;
		padding:0 10%;
	}
	.linkBox .btn20 {
	   width: 80%;
	   height: 60px;
	}
}



/* スマートフォン 縦(ポートレート) */
@media only screen and (max-width:480px){
	#header .logo{padding-top:10px;}
  .info{padding:10px 0 0;}
	
	ul#topnav li{width:50%;}

	ul#topnav li:nth-child(3n){
	border-right:1px solid #1c1c1c;
	width:50%;
	}
	
	.inner{
		margin: 0 auto;
		text-align: center;
	}
	.logo{
		margin-left: auto;
		margin-right: auto;
	}
	.col30{
		margin: 0.5em;
		width:45%;
	}
	ul#topnav li:nth-child(2n),ul#topnav li:nth-child(6n){border-right:0;}
	
	#mainBanner{margin-left:1px;}
	#mainBanner h2,#mainBanner h3{font-size:80%;}
	
	.footergrid2{
		display: none;
	}
	.five{
		display: block;
	}
	.fiveContent{
		width:50%;
		text-align: center;
		margin:10px 0;
		float: left;
	}
	.col100{
		margin:20px;
	}
	.box26 {
	    margin: 1em;
	}
	.osirase{
		margin-left: 0;
		margin-right: 0;
	}
	.osirase li{
		display: block;
	}
	.nitiji{
		margin-top:5px; 
		float: left;
		width:35%;
	}
	.blogCateB{
		float: right;
		width:50%;
	}
	.blogCateR{
		float: right;
		width:50%;
	}
	.blogCateG{
		float: right;
		width:50%;
	}
	.blogtitle{
		margin-top:45px; 
		width:100%;
		word-break: break-all;
	}
}
.PHC105tokutyou{
	text-align: left !important;
}

