@charset "utf-8";



/*全端末（PC・タブレット・スマホ）共通設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/

/*全体の設定
---------------------------------------------------------------------------*/
body {
	margin: 0px;padding: 0px;
	color: #333;	/*全体の文字色*/
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;	/*フォント種類*/
	font-size: 18px;	/*文字サイズ*/
	line-height: 2;		/*行間*/
	background: #fff;	/*背景色*/
	-webkit-text-size-adjust: none;
	box-sizing: border-box;
}
h1,h2,h3,h4,h5,p,ul,ol,li,dl,dt,dd,form,figure,form{margin: 0px;padding: 0px;font-size: 100%;font-weight: normal;}
textarea,select,input[type="text"],input[type="checkbox"],input[type="radio"],input[type="button"],input[type="tel"],input[type="email"],input[type="submit"]{font-size: 100%; width:97%; padding: 20px 0 20px 10px;border:none;}
h1,h2,h3,h4,#menubar {font-family:"游明朝","Yu Mincho","游明朝体","YuMincho","ヒラギノ明朝 Pro W3","Hiragino Mincho Pro";}
ul {list-style-type: none;}
ol {padding-left: 40px;padding-bottom: 15px;}
img {border: none;max-width: 100%;height: auto;vertical-align: middle;}
table {border-collapse:collapse;font-size: 100%;border-spacing: 0; max-width: 900px; width: 100%;  margin: 30px auto 0;}
iframe {width: 100%;}

/*リンク（全般）設定
---------------------------------------------------------------------------*/
a {
	color: #333;	/*リンクテキストの色*/
	transition: 0.5s;	/*マウスオン時の移り変わるまでの時間設定。0.5秒。*/
}
a:hover {
	color: #d5889a;			/*マウスオン時の文字色*/
	text-decoration: none;	/*マウスオン時に下線を消す設定。残したいならこの１行削除。*/
}

/*inner共通
---------------------------------------------------------------------------*/
.inner {
	max-width: 1200px;	/*サイトの最大幅　※下の方の「画面幅1200px以上の設定」にも関連するので変更の際は注意して下さい。*/
	margin: 0 auto;
}

/*ヘッダー（ロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/
/*ヘッダーブロック*/
header {
	border-top: 4px solid #d5889a;	/*上の線の幅、線種、色*/
}
header .inner {
	 height: 100px;
	position:relative;
    z-index: 10;
    width: 100%;
    background-color: white;
}
/*ロゴ画像*/
header #logo img {
	width: 350px;	/*画像幅*/
	position: absolute;
	left: 3%;		/*ヘッダーに対して左から3%の場所に配置*/
	top: 18px;	/*ヘッダーに対して上から38pxの場所に配置*/
}

/*文字サイズ変更ボタン（※文字サイズを「大」にした時の設定はchange.cssで行う）
---------------------------------------------------------------------------*/
/*ボタンブロック全体*/
#fsize {
	position: absolute;
	right: 3%;		/*ヘッダーブロックに対して右から3%の場所に配置*/
	top: 0px;		/*ヘッダーブロックに対して上から0pxの場所に配置*/
	width: 250px;	/*ブロック幅*/
	background: #fff;	/*背景色*/
	box-shadow: 0px 0px 8px rgba(0,0,0,0.15);	/*影の設定。右へ、下へ、ぼかし幅。rgbaは色設定で0,0,0は黒。0.15は透明度15%の事。*/
	border-radius: 0px 0px 4px 4px;	/*角丸のサイズ。左上、右上、右下、左下への順。*/
	line-height: 50px;	/*高さ*/
	padding: 10px 0px;	/*上下、左右へのボックス内の余白*/
}
/*「文字サイズ」のテキスト*/
#fsize p {
	float: left;
	font-size: 18px;	/*文字サイズ*/
	padding: 0 20px;	/*上下、左右への余白*/
}
/*文字サイズボタン１個あたり*/
#fsize ul li {
	float: left;	/*左に回り込み*/
}
#fsize ul a {
	overflow: hidden;display: block;text-decoration: none;text-align: center;
	color: #fff;	/*文字色*/
}
/*「小」ボタン設定*/
#fsize ul li#small a::before {
	display: block;
	content: "小";		/*「小」の文字を出力*/
	font-size: 18px;	/*文字サイズ*/
	background: #d5889a;	/*背景色*/
	width: 40px;		/*幅*/
	line-height: 40px;	/*高さ*/
	margin-top: 5px;
	margin-right: 10px;
}
/*「大」ボタン設定*/
#fsize ul li#large a::before {
	display: block;
	content: "大";		/*「大」の文字を出力*/
	font-size: 30px;	/*文字サイズ*/
	background: #ccc;	/*背景色*/
	width: 50px;		/*幅*/
	line-height: 50px;	/*高さ*/
}
/*マウスオン時の「大」ボタン設定*/
#fsize ul li#large a:hover::before {
	background: #d5889a;	/*背景色*/
}
/* 各ボタン　*/
.btn-gradient-radius {
  display: inline-block;
  padding: 8px 70px;
  font-size: 20px;
  border-radius: 4px;
  text-decoration: none;
  color: #FFF;
  background-image: linear-gradient(45deg, #FFC107 0%, #ff8b5f 100%);
  transition: .4s;
}

.btn-gradient-radius:hover {
  background-image: linear-gradient(45deg, #FFC107 0%, #f76a35 100%);
}

/*ヘッダー内メニュー（「資料請求・お問い合わせ」と「見学のお申し込み」ボタン）
---------------------------------------------------------------------------*/
/*メニューブロック全体*/
#headermenu {
	position: absolute;
	right: 3%;		/*header のinnerに対して右から3%の場所に配置*/
	bottom: 33px;	/*header のinnerに対して下から15pxの場所に配置*/
}
/*メニュー１個あたり*/
#headermenu li {
	float: left;	/*左に回り込み*/
	margin-left: 10px;	/*左側にスペースを空ける*/
	margin-top: 5px;
}
#headermenu li a {
	text-decoration: none;display: inline-block;
	background: #ff8a00;	/*背景色（古いブラウザ用）*/
	background: linear-gradient(#ffa600, #ff8a00);	/*グラデーション*/
	color: #FFF;	/*文字色*/
	padding: 0px 15px;	/*上下、左右へのボックス内の余白*/
	border-radius: 4px;	/*角丸のサイズ*/
	border: 1px solid #ff8a00;	/*枠線の幅、線種、色*/
}
/*マウスオン時*/
#headermenu li a:hover {
	color: #ff8a00;	/*文字色*/
	background: #fff;	/*背景色*/
}

#menubar ul {
	max-width:1200px;
	margin:0 auto;
}


/* 3カラム部分
---------------------------------------------------------------------------*/
.colum3 {
	display: flex;
}
.colum-3{
	text-align: center;
}
.ec{
	margin-top: 20px;
}
.box {
	text-align: center;
	margin:0 auto;
	width: calc(100% / 3);
	width: 32.2%;
   width: -webkit-calc(100% / 3);
}

.box-title {
	font-size: 20px;
}

.box_txt {
	padding: 20px 10px !important;
    font-size: 18px;
}
/*メインメニュー
---------------------------------------------------------------------------*/
/*メニューブロック*/
#menubar {
	clear: both;overflow: hidden;
	border-top: 1px solid #dcdcdc;	/*上の線の幅、線種、色*/
	border-bottom: 1px solid #dcdcdc;	/*下の線の幅、線種、色*/
	font-size: 18px;	/*文字サイズ*/
	background-color: pink;
}
/*メニュー１個あたりの設定*/
#menubar li {
	float: left;	/*左に回り込み*/
	width: 16.66%;		/*メニュー幅（100÷5個=20%）※下の方の「画面幅1200px以上の設定」にも関連するので変更の際は注意して下さい。*/
}
#menubar li a {
	display:  block;text-decoration: none;
	text-align: center;	/*内容をセンタリング*/
	padding: 15px 0;	/*上下、左右へのボックス内の余白*/
	border-right: 1px solid #dcdcdc;	/*右の線の幅、線種、色*/
}
/*１つ目のメニューへの追加設定*/
#menubar li:first-child a {
	border-left: 1px solid #dcdcdc;	/*左の線の幅、線種、色*/
}
/*マウスオン時と、現在表示中(current)メニューの設定*/
#menubar li a:hover,
#menubar li.current a {
	background: hotpink;	/*背景色*/
	color: #fff;	/*文字色*/
}
/*spanタグを非表示に*/
#menubar span {display: none;}
/*スマホ用メニューを表示させない*/
#menubar-s {display: none;}
/*３本バーアイコンを表示させない*/
#menubar_hdr {display: none;}

/*ドロップダウンメニュー用
----------------------------------------------------------------------------------------------------------------------------------*/
/*メニューブロック*/
#menubar ul.ddmenu {
	position:absolute;visibility: hidden;z-index: 10;margin-top: 1px;
	width: 20%;	/*幅。上の「#menubar li」と合わせる。*/
}
/*メニュー１個あたりの設定*/
#menubar ul.ddmenu li {
	float: none;
	width: 100%;
}
#menubar ul.ddmenu li a {
	width: 100%;border: none;
	background: #4c4c4c;	/*背景色（古いブラウザ用）*/
	background: rgba(0,0,0,0.7);	/*背景グラデーション。0,0,0は黒の事で0.7は透明度70%の事。*/
	color: #fff;	/*文字色*/
	padding: 6px 0;	/*上下、左右へのボックス内の余白*/
	border-bottom: 1px solid #fff;	/*下の線の幅、線種、色*/
}
/*マウスオン時*/
#menubar ul.ddmenu li a:hover {
	background: #d5889a;	/*背景色*/
}

/*コンテンツ（mainとsubを囲むブロック）
---------------------------------------------------------------------------*/
.contents {
	clear: both;overflow: hidden;
	padding: 50px 0px;	/*上下、左右へのボックス内の余白*/
}
/*h2タグの設定*/
.contents h2 {
	padding: 10px 20px;
    font-size: 150%;
    letter-spacing: 0.1em;
    font-weight: bold;
}
/*h2タグの左側のアクセント*/
.contents h2::first-letter {
	/*border-left: 3px solid #d5889a;	左の線の幅、線種、色
	padding-left: 20px;	/*線とテキストとの距離*/
}
/*h3タグの設定*/
.contents h3 {
	clear: both;
	margin-bottom: 30px;	/*見出しの下にとるスペース*/
	padding: 0px 20px;		/*上下、左右への余白*/
	border-bottom: 1px solid #ccc;	/*枠線の幅、線種、色*/
	font-size: 130%;	/*文字サイズ。上の「body」で設定しているサイズに対しての指定。*/
	letter-spacing: 0.1em;	/*文字間隔を少し広くとる設定*/
}
/*h3タグの左側のアクセント*/
.contents h3::first-letter {
	border-left: 3px solid #d5889a;	/*左の線の幅、線種、色*/
	padding-left: 20px;	/*線とテキストとの距離*/
}
/*h4タグの設定*/
.contents h4 {
	font-size: 130%;	/*文字サイズ。上の「body」で設定しているサイズに対しての指定。*/
	padding: 10px 20px;		/*上下、左右への余白*/
	border-bottom: 1px solid #ccc;	/*下線の幅、線種、色*/
	margin-bottom: 30px;	/*見出しの下にとるスペース*/
}
/*段落タグ設定*/
.contents p {
	padding: 0px 20px 40px;	/*上、左右、下への余白*/
}
/*段落タグが続く場合に余白が空きすぎないようにする*/
.contents p + p {
	margin-top: -20px;
}
/*h2とh3とh4タグの直後の段落タグ設定*/
.contents h2 + p,
.contents h3 + p,
.contents h4 + p {
	margin-top: -10px;
	
}
/*  新着情報　　 */
p.event-day {
    float: right;
}
.topicsCont h2 {
    text-align: center;
	font-size:2em !important;
}
.topicsCont {
    width: 920px;
    margin: 0 auto;
    overflow: hidden;
	margin-bottom:60px;
	padding-top:30px;
}
dl.new-topics {
    display: flex;
	background: #f7f7f7;
	padding: 15px 20px;
}
.new-topics dt {
    margin-right: 2em;
    color: #c7bd08;
}
.new-topics dd {
    font-weight: bold;
}
@media screen and (max-width:800px){
.topicsCont {
    width: 90%;
}
	.topicsCont h2 {
	font-size:1.5em !important;
}
	
}


/* イベントページ */
.pictures {
    margin: 30px 5%;
}
.pictures-list ul {
    display: flex;
    justify-content: space-between;
}
.picture {
    width: 32%;
}


h2.sub-title01 {
    font-size: 1.8em;
	 padding: 0;
	color: #3cb3e4;
   text-shadow: 1px 1px 0px #666666;
	 padding-bottom: 10px;
}
p.sub-title02 {
    font-weight: bold;
    font-size: 1.3em;
    padding: 0;
}
.lp-title {
    display: flex;
	margin: 0 5%;
	padding-bottom: 10px;
}
/* .lp-title p {
   	padding: 10px 15px;
    margin-right: 5%;
    font-size: 1.5em;
    font-weight: bold;
    color: mediumpurple;
    border: 3px solid mediumpurple;
} */
.lp-title p {
    color: #d747e8;
    font-weight: bold;
    font-size: 1.5em;
    text-align: center;
    padding: 0.25em;
    margin-right: 5%;
    border-top: solid 2px #d747e8;
    border-bottom: solid 2px #d747e8;
    background: -webkit-repeating-linear-gradient(-45deg, #f0f8ff, #f0f8ff 3px,#e9f4ff 3px, #e9f4ff 7px);
    background: repeating-linear-gradient(-45deg, #fbf0ff, #faf0ff 3px,#ffe9fd 3px, #fee9ff 7px);
}
.lp-sub-title {
    position: relative;
    padding: 10px;
    background: #fff0d9;
    font-size: 20px;
    color: #2d2d2d;
    margin: 0 5%;
    line-height: 1.3;
    border-bottom: solid 3px orange;
    z-index: -2;
    text-align: center;
}
.lp-sub-title::before {
    position: absolute;
    content: '';
    left: -3px;
    top: 0px;
    width: 0;
    height: 0px;
    border: none;
    border-left: solid 40px white;
    z-index: -1;
}
.lp-sub-title::after {
    position: absolute;
    content: '';
    right: -1px;
    top: 0px;
    width: 0;
    height: 0;
    border: none;
    border-left: bisque;
    border-bottom: solid 92px white;
    z-index: -1;
}
/* .lp-sub-title {
    text-align: center;
	 width:80%;
    margin: 0 auto;
    margin-bottom: 30px;
	 position: relative;
    padding: 0.25em 1em;
    border-top: solid 2px black;
    border-bottom: solid 2px black;
}
.lp-sub-title::before {
    left: 2vw;
}
.lp-sub-title::after {
    right: 2vw;
}
.lp-sub-title::before, .lp-sub-title::after {
    content: '';
    position: absolute;
    top: -16px;
    width: 2px;
    height: -webkit-calc(100% + 14px);
    height: calc(100% + 31px);
    background-color: black;
} */

p.intro-text, p.requirement-text {
    padding: 0;
	text-align:center;
	margin: 0 5%;
}
p.intro-text {
	margin-top: 20px !important;
}
p.add-text {
	padding: 0;
	margin: 0 5%;
	font-size:0.9em;
	margin-bottom: 30px;
}
p.time-table-text span, p.requirement-title span, p.caution-title span {
	display:inline-block;
	padding-left: 23px;
    padding-right: 23px;
    background: white;
    position: relative;
}
p.time-table-text, p.requirement-title, p.caution-title {
	padding:0;
	font-weight:bold;
	text-align: center;
    color: #0075c1;
    font-size: 1.3em;
	position:relative;
	width: 80%;
   margin: 0 auto;
}
p.requirement-title, p.caution-title {
	margin-bottom:30px;
}
.requirement, .caution, .sponsor {
    margin-bottom: 60px;
}
p.time-table-text::before {
	content:'';
	background-color: #0075c1;
	position: absolute;
   display: block;
   width: 100%;
   height: 4px;
	top:22px;
   left: 0;
}
p.requirement-title::before {
	content:'';
	background-color: #0075c1;
	position: absolute;
   display: block;
   width: 100%;
   height: 4px;
	top:22px;
   left: 0;
}
p.caution-title::before {
	content:'';
	background-color: #0075c1;
	position: absolute;
   display: block;
   width: 100%;
   height: 4px;
	top:22px;
   left: 0;
}
.time-table table{
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
	margin-bottom:60px;
}
.time-table table td:first-child {
  border-top: 1px solid #a8b7c5;
	width:30%;
	font-weight: bold;
}
.time-table table td:nth-child(2) {
  border-top: 1px solid #a8b7c5;
	font-weight: bold;
	text-align: left;
    padding: 10px 20px;
}
.time-table table td{
  padding: 10px 0;
  text-align: center;
  border-left: 1px solid #a8b7c5;
  border-bottom: 1px solid #a8b7c5;
  border-right: 1px solid #a8b7c5;
}

.time-table table tr:nth-child(odd){
  background-color: #eee
}
.info-table table{
  width: 100%;
  border-collapse: collapse;
	margin-bottom: 30px;
}
.info-table, .time-table, .sponsor {
    margin: 0 5%;
}
.info-table  table tr{
  border-bottom: solid 2px white;
}

.info-table table tr:last-child{
  border-bottom: none;
}

.info-table table th{
  position: relative;
  text-align: left;
  width: 30%;
  background-color: #52c2d0;
  color: white;
  text-align: center;
  padding: 10px 0;
}
.info-table table td{
  text-align: left;
  width: 70%;
  text-align: center;
  background-color: #eee;
  padding: 10px 0;
	font-weight:bold;
}

.lp-title h1 {
    font-size: 1.6em;
	margin-top: 10px;
	    font-weight: bold;
}
p.sub-title02 {
    padding-bottom: 10px;
}
.lp-inner {
	max-width:900px;
	margin:0 auto;
}
.sponsor {
    padding: 3vh;
    background-color: #0074c1;
    color: white;
	margin-bottom:60px;
}
p.sponsor-name, p.sponsor-ship {
    text-align: center;
    font-size: 2em;
    font-weight: bold;
	 padding: 0;
}
p.sponsor-name span, p.sponsor-ship span {
	padding-right:3vw;
}

.requirement ol {
  counter-reset:number; /*数字をリセット*/
  list-style-type: none!important; /*数字を一旦消す*/
  padding: 0.3em 0.8em;
  border: solid 2px #ffb107;
	margin: 0 5%;
}
.requirement ol li {
  border-bottom: dashed 1px orange;
  position: relative;
  padding: 0.5em 0.5em 0.5em 30px;
  line-height: 1.5em;
	font-weight: bold;
}
.requirement ol li:before{
  /* 以下数字をつける */
  position: absolute;
  counter-increment: number;
  content: counter(number);
  /*数字のデザイン変える*/
  display:inline-block;
  background: #ffb107;
  color: white;
  font-family: 'Avenir','Arial Black','Arial',sans-serif;
  font-weight:bold;
  font-size: 15px;
  border-radius: 50%;
  left: 0;
  width: 25px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  /*以下 上下中央寄せのため*/
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.requirement ol li:last-of-type {
  border-bottom: none; /*最後のliの線だけ消す*/
}

.caution ul {
  border: solid 2px #ffb03f;
  padding: 0.5em 1em 0.5em 2.3em;
  position: relative;
	margin: 0 5%;
}
.caution ul li {
  line-height: 1.5;
  padding: 0.5em 0;
  list-style-type: none!important;/*ポチ消す*/
}
.caution ul li:before {
  font-family: "Font Awesome 5 Free";
  content: "\f00c";
  position: absolute;
  left : 1em; /*左端からのアイコンまで*/
  color: #ffb03f; /*アイコン色*/
}

@media screen and (max-width:800px){
	.requirement, .caution, .sponsor, .time-table table {
		margin-bottom: 30px;
		margin-top:0;
	}
	p.requirement-title, p.caution-title {
		margin-bottom:0 ;
	}
	.requirement-text {
		margin-top:0;
	}
	p.sponsor-ship, p.sponsor-name {
		    margin-bottom: 0 !important;
	}	
	.picture {
    width: 100%;
    margin: 10px auto;
  }
	.pictures-list ul {
    display: block;
	}
  .lp-sub-title {
    font-size: 1.5rem;
  }
}
@media screen and (max-width:480px){
	.lp-title p {
    width: 36%;
	}
}


/* 法人概要 */
h1.prof-ttl {
    padding: 8px 24px;
    margin: 0 auto 16px;
    border-radius: 8px;
    font-size: 2em;
    text-align: left;
    color: #fff;
    line-height: 1.4em;
    background: #61aa31;
    position: relative;
    overflow: hidden;
}




/* 各ブロック　*/
.body-img img{
    padding-right: 5vw;
    padding-top: 1.5vw;
    width: 20%;
}
.btn {

}
.prof-btn, .info-btn {
	position: relative;
	top: 70%;
}
.clera {
	clear: both;
}
.colum2 {
	display: flex;
	justify-content: space-between;
	text-align: center;
}
.colum-3 h2{
  color: #F46A75;
}
.guide{
	background-color: #ffb6b0;
}
.greeting {
	background-color: #ffd98e;
    /*background-image: url(../images/sakura.png);*/
    background-position: bottom;
}

.event-body {
	text-align: center;
	margin-bottom: 50px;
}
.event {
	background-color: #F7D2DF;
	padding-bottom: 1px;
	/*background-image: url(../images/sakura.png);*/
    background-position: bottom;
}
.event-img3 {
    padding: 30px;
}
.event-l {
	width: 75%;
}

.event-img {
	width: 32%!important;
}
.facebook.event-r {
    padding-top: 30px;
}

.greeting {
	margin-bottom: 30px;
}
.greeting h2 {
	margin-bottom: 5vw;
}

/*.facebook {
	float: right;
	width: 26%;
}*/

iframe {
	display: block;
}

.main-block {
	margin-top: 30px;
}

.main-body-l {
	float: left;
	text-align: center;
	width: 50%;
	padding: 36px 0;
}
.main-body-r {
	float: right;
	text-align: center;
	width: 50%;
	padding: 40px 0;
}
.message {
	background-color: #C6EEF3;
	overflow: hidden;
	margin-top: 50px;
}

.message .main-body-l {
	 width: 55%;
    padding: 20px 0 0 10vw;
}

.message-body h2 {
	color: rgb(228,000,127);
}
.fr {
	width: 50%;
}
.fl {
	width: 50%;
	/*float: left;*/
}
.profile , .information{
	-webkit-background-size: contain;
	background-size: cover;
	background-repeat: no-repeat;
	height: 300px;
	width: 49%;
}
.profile {
	background-image: url(../images/kaigoshi3.jpg) ;
	filter: brightness(100%);
    transition: filter 0.4s ease;

}
.profile:hover{
	filter: brightness(80%);
}
.profile a{
	position: relative;
}

.information {
	background-image: url(../images/info.jpg) ;
	filter: brightness(100%);
    transition: filter 0.4s ease;
}
.information:hover{
	filter: brightness(80%);
}
.prof-info {
	background-color: #c0f0a0;
}
.social-wrap{
	display: flex;
	display: -ms-flex;
   display: -webkit-flex;
}
.social-media{
	margin-top: 50px;
}
.social-media h2{
	text-align: center;
}
.social-right {
	width: 31%;
}
.social-left {
    text-align: center;
    width: 77%;
}
.social-left p{
	padding: 0 0 40px;
}
.social-left img {
	width: 90%;
}
.social-left img:hover{
	opacity: 0.7;
}
.txt-r {
	text-align: right;
	font-weight: bold;
}
.txt-l {
	text-align: left;
	font-weight: bold;
}
.word-break{
	display: inline-block;
}

@media screen and (min-width:800px){
	.greeting-ttl{
		margin-bottom:40px;
	}

}

@media screen and (max-width:1024px){
 .contents h2{
 	font-size: 1.3em;
 }
 .main-body-l{
 	padding: 0;
 }
 .social-right {
    width: 62%;
 }
 .social-left {
    width: 110%;
 }
}

@media screen and (max-width:800px){
	header .inner{
	  position: fixed;
     top: 0;
     z-index: 10;
	}
	.ec{
		width: 30%;
	}
	.contents h2,.contents p {
		font-size: 80%;
	}
	.contents h2 {
		padding: 20px;
	}
	.contents p {
    	padding: 5px;
		margin-bottom: 5%;
    }
    .event {
    	flex-direction: column;
    }
    .event-img3{
    	padding-bottom: 0;
    }
    .event-l {
	    width: 100%;
	}
    .event-body button {
    	margin-top: 4vw;
    }
    .greeting h2 {
    	margin-bottom: 1vw;
	}
	.main-body-l,.main-body-r {
		padding: 0;
	}
	.profile, .information {
		height: 200px;
	}
	section.event-sec {
	    margin-top: -40px;
	}
	.sp{
		display: none;
	}
	.social-wrap{
		flex-direction: column;
	}
	.social-left{
		width: 100%;
	}
	.social-right{
		width: 42%;
		margin: 0 auto;
	}
	.social-left p{
		margin-bottom: 12px;
	}


}

@media screen and (max-width:480px){
	.box { width:100%;
	}
	.box_txt{
		margin-top: 5%;
	}
	.btn-gradient-radius{
		font-size: 16px;
	}
	.colum2{
		flex-direction: column;
	}

	.colum3{
		flex-direction: column;
	}
	.contents p{
	   font-size: 14px;
		padding: 12px !important;
	}
  .sponsor-name {
    font-size: 18px;
  }
	.contents h2, .contents h3, .contents h4{
		font-size: 16px;
	}
	.ec{
		width: 50%;
	}
	.event-img {
	    width: 100%!important;
	    margin-bottom: 10px;
	}
	.event-body{
		margin-bottom: 20px;
	}
	.main-body-l,.main-body-r{
		float: none;
		width: 100%;
		margin-bottom: 10%;
	}
	.message .main-body-l{
		width: 100%;
		padding: 20px 0 0 0;
	}
	
	.message-body h2{
		text-align:center;
		padding: 0 !important;
	}
	
	.profile, .information{
		width: 100%;
		margin-bottom: 30px;
	}
	.sp{
		display: block;
	}
	#menubar_hdr{
		top: 4%!important;
	}
	#headermenu {
	    right: 1%!important;
	    bottom: 4px!important;
	}
	.social-left p{
		margin-bottom: 28px;
		font-size: 12px;
    padding: 5px !important;
	}
	.social-right {
    width: 74%;
	}
	.txt-l{
		padding: 0 6%!important;
	}
	


}
@media screen and (max-width:425px){
	#headermenu {
	    bottom: 1px!important;
	}
}
/*画面幅480px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:480px){

/*全体の設定
---------------------------------------------------------------------------*/
body {
	font-size: 12px;	/*文字サイズ*/
}

/*ヘッダー（ロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/
/*ロゴ画像*/
header #logo img {
	width: 50%;	/*画像幅*/
	min-width: 200px;
	top: 20%;	/*ヘッダーに対して上から20%の場所に配置*/
}

/*コンテンツ
---------------------------------------------------------------------------*/
.contents h2, .contents h3,.contents h4 {
	padding: 5px 0px 5px 10px;
	margin-bottom: 20px;
	font-size: 24px;
}
/*h2,h3タグの左側のアクセント*/
.contents h2::first-letter,
.contents h3::first-letter {
	padding-left: 10px;	/*線とテキストとの距離*/
}
/*段落タグ設定*/


/*subコンテンツ
---------------------------------------------------------------------------*/
/*subコンテンツ内のh2タグ設定*/
.sub h2 {
	margin-bottom: 10px;
}
/*サブコンテンツ内のbox1
---------------------------------------------------------------------------*/
.sub .box1 {
	padding: 10px;			/*ボックス内の余白*/
}

/*ブログページのフィードバック以降のブロック
---------------------------------------------------------------------------*/
/*「返信」した記事*/
ol.commentlist ul.children {
	margin-left: 0px;
}

/*ブログページのフィードバック以降のブロック
---------------------------------------------------------------------------*/
/*フォームの左側の見出し*/
#respond label {
	display: block;
	width: auto;
	text-align: left;
	vertical-align: middle;
}
/*inputタグ、textareaタグ*/
#respond input, #respond textarea {
	width: 96%;
}

/*フッターメニュー
---------------------------------------------------------------------------*/
/*ボックス全体*/
#footermenu {
	display: none;
}

/*トップページ内「更新情報・お知らせ」ブロック
---------------------------------------------------------------------------*/
/*ブロック全体の設定*/
#new dl {
	padding-left: 10px;
}

/*お知らせ用の設定
---------------------------------------------------------------------------*/
/*コメント*/
.news .comment {
	padding-left: 0;
}
/*コメント内の段落タグ*/
.news .comment p {
	padding: 0 !important;
}
/*アイコン（共通）*/
.news .category a {
	display: none;
}

/*カスタムフィールド出力用（擬似テーブル）
---------------------------------------------------------------------------*/
/*各行（左側ブロック）*/
ul.post-meta li .post-meta-key {
	width: 100px;		/*幅*/
}

/*テーブル（ta1）
---------------------------------------------------------------------------*/
/*ta1設定*/
.ta1, .ta1 td, .ta1 th {
	padding: 5px;	/*ボックス内の余白*/
}
/*テーブル１行目に入った見出し部分*/
.ta1 th.tamidashi {
	font-size: 14px;	/*文字サイズ*/
}
/*ta1の左側ボックス*/
.ta1 th {
	width: 100px;
}

/*その他
---------------------------------------------------------------------------*/
.ws,.wl {width: 94%;}
.big1 {font-size: 16px;}
img.fr,img.fl {float: none;margin: 0;width: 100%;padding-right:0;}
.sh {display:block;}
.pc {display:none;}

}
@media screen and (max-width:375px){
	.social-right {
    width: 83%;
	}
}

@media screen and (max-width:320px){
	.social-right {
    width: 90%;
	}
}
/*listブロック
---------------------------------------------------------------------------*/
/*listブロック設定*/
.list {
	overflow: hidden;position: relative;
	box-shadow: 0px 0px 5px rgba(0,0,0,0.3) inset;	/*ボックスの影。右へ、下へ、ぼかす範囲。0,0,0は黒の事で0.3は透明度30%の事。insetは内側に向かう影。*/
	margin: 0 2% 30px;	/*上、左右、下へのボックスの外に空けるスペース*/
	background: #fff;	/*背景色*/
	transition: 0.5s;	/*マウスオン時の移り変わるまでの時間設定。0.5秒。*/
	padding: 4%;	/*ボックス内の余白*/
}
.list a {
	overflow: hidden;text-decoration: none;display: block;
}
/*h4タグ設定*/
.list h4 {
	padding: 10px;
	border: none;
	font-size: 200%;	/*文字サイズ*/
	color: #d5889a;		/*文字色*/
	line-height: 1.2em;
	height: 1em;overflow: hidden;	/*１行を超えた部分は非表示になる*/
	margin-bottom: 0.5em;
}
/*段落タグ設定*/
.list p {
	margin: 0 !important;
	padding: 0 !important;
	line-height: 1.8;
	overflow: hidden;
}
/*figure画像の設定*/
.list figure img {
	width: 20%;		/*画像幅*/
	float: left;	/*左に回り込み*/
	margin: 0 4% 0 0;	/*上、右、下、左への画像の外側にとるスペース*/
}
/*右下の「→」マーク設定*/
.list a::before {
	content: "→";	/*このテキストを表示させる。変更しても構いませんが機種依存文字は化ける場合があるので使わない。*/
	font-size: 20px;	/*文字サイズ*/
	text-align: center;
	border-radius: 50%;	/*円形にする*/
	background: #b2b2b2;	/*背景色（古いブラウザ用）*/
	background: rgba(0,0,0,0.3);	/*背景色。0,0,0は黒の事で0.3は透明度30%の事。*/
	color: #fff;	/*文字色*/
	position: absolute;
	right: 10px;	/*右から10pxの場所に配置*/
	bottom: 10px;	/*下から10pxの場所に配置*/
	width: 30px;	/*幅*/
	line-height: 30px;	/*高さ*/
	transition: 1s;	/*マウスオン時の移り変わるまでの時間設定。1秒。*/
}
/*右下の「→」マークのマウスオン時*/
.list a:hover::before {
	background: #d5889a;	/*背景色*/
	box-shadow: 0px 0px 0px 10px #d5889a;	/*ボックスの影の指定ですが、円がそのまま大きくなるような動作になります。右へ、下へ、ぼかす範囲、距離。最後は色。*/
}
/*2カラム利用時--------------------------------------------*/
.c2 .list {
	float: left;	/*左に回り込み*/
	padding: 3%;	/*ボックス内の余白の上書き*/
	width: 40%;		/*幅*/
}
/*h4タグ*/
.c2 .list h4 {
	font-size: 130%;
}
/*p段落タグ*/
.c2 .list p {
	height: 5.4em;	/*上の「.list p」の「1.8」×「表示させたい行数」を設定。5.4だと3行分になる。*/
}
/*3カラム利用時--------------------------------------------*/
.c3 .list {
	float: left;	/*左に回り込み*/
	padding: 2%;	/*ボックス内の余白の上書き*/
	width: 25.3%;	/*幅*/
}
/*h4タグ*/
.c3 .list h4 {
	font-size: 110%;
}
/*p段落タグ*/
.c3 .list p {
	font-size: 80%;
	height: 7.2em;	/*上の「.list p」の「1.8」×「表示させたい行数」を設定。7.2だと4行分になる。*/
}
/*右下の「→」マークを少し小さく設定しなおす*/
.c3 .list a::before {
	width: 20px;
	line-height: 20px;
	font-size: 12px;
}

/*ブログページ
---------------------------------------------------------------------------*/
/*各ボックスの設定*/
.blog {
	overflow: hidden;
	margin-bottom: 20px;	/*ボックス同士の上下に空けるスペース*/
}
.blog a {
	text-decoration: none;
	display: block;
	overflow: hidden;
	border: 5px solid #eee;	/*枠線の幅、線種、色*/
	padding: 20px;			/*ボックス内の余白*/
}
/*マウスオン時*/
.blog a:hover {
	border: 5px solid #d5889a;	/*マウスオン時の枠線の設定*/
	color: #000;				/*文字色*/
}
/*h3タグの設定*/
.blog h3 {
	border: none;
	background: transparent;
	padding: 0;
	color: #d5889a;	/*文字色*/
	font-size: 24px;	/*文字サイズ*/
}
/*段落タグ*/
.blog p {
	padding: 0;
}
/*figure画像の設定*/
.blog figure {
	float: left;	/*左に回り込み*/
	margin-right: 20px;
}
/*コメント数、日付の行*/
.blog .date {
	color: #999;		/*文字色*/
	font-size: 12px;	/*文字サイズ*/
	margin-top: 10px;	/*上に空けるスペース*/
}

/*ブログページのフィードバック以降のブロック
---------------------------------------------------------------------------*/
/*コメントのリストタグ*/
ol.commentlist {
	color: #999;		/*文字色*/
}
ol.commentlist p {
	padding: 0 !important;
}
/*コメント表示欄の名前と日付*/
.comment-meta, .comment-author {
	display: inline;
	font-weight: bold;	/*太字にする設定*/
}
/*「返信」ボタン*/
.reply a {
	display: block;
	text-decoration: none;
	text-align: center;
	margin-left: auto;
	width: 80px;	/*ボタンの幅*/
	border: 1px solid #ccc;	/*枠線の幅、線種、色*/
	border-radius: 4px;		/*角丸のサイズ*/
	background: linear-gradient(#fff, #eee);	/*グラデーション*/
	box-shadow: 0px 1px 3px rgba(0,0,0,0.15);	/*ボックスの影。右に、下に、広げる幅、0,0,0は黒の事で0.15は透明度15%の事。*/
	margin-bottom: 20px;
}
/*「返信」した記事*/
ol.commentlist ul.children {
	margin-left: 40px;	/*返信元の記事とずらす距離*/
}
ol.commentlist > li {
	border-bottom: 1px solid #eee;	/*記事間の境界線*/
	padding: 20px 0;
}
/*コメント入力用フォームボックス（「コメントを残す」のボックス）*/
#respond {
	overflow: hidden;
	border: 5px solid #eee;	/*枠線の幅、線種、色*/
	padding: 20px;			/*ボックス内の余白*/
	color: #999;			/*文字色*/
	margin-bottom: 20px;
}
/*フォームの左側の見出し*/
#respond label {
	display: inline-block;
	width: 20%;
	text-align: right;
	vertical-align: top;
}
/*inputタグ、textareaタグ*/
#respond input, #respond textarea {
	width: 75%;
	border: 1px solid #999;
}
/*「メールアドレスが公開されることはありません・・・」の文章*/
#respond p.comment-notes {
	margin-bottom: 20px;
}
/*「*」マーク*/
.required {
	color: #ff0000 !important;
}
/*「コメントを送信」ボタン*/
#respond input.submit {
	width: auto;
	display: block;
	background: #fff;
	margin: 20px auto 0;
	border-radius: 4px;
	background: linear-gradient(#fff, #eee);	/*グラデーション*/
	box-shadow: 0px 1px 3px rgba(0,0,0,0.15);	/*ボックスの影。右に、下に、広げる幅、0,0,0は黒の事で0.15は透明度15%の事。*/
}

/*mainコンテンツ
---------------------------------------------------------------------------*/
.main {
	overflow: hidden;
}

/*subコンテンツ
---------------------------------------------------------------------------*/
/*subブロック*/
.sub {
	float: right;	/*右に回り込み*/
	width: 24%;		/*幅*/
}
/*subコンテンツ内のh2タグ設定*/
.sub h2 {
	background: none;border: none;box-shadow: none;padding: 0;letter-spacing: normal;
	font-size: 120%;	/*文字サイズ*/
	margin-bottom: 20px;
}
/*subコンテンツのh2タグの１文字目への設定*/
.sub h2::first-letter {
	padding-left: 15px;
}
/*段落タグ設定*/
.sub p {
	padding-bottom: 10px;	/*上、左右、下への余白*/
}

/*サブコンテンツ内のメニュー
---------------------------------------------------------------------------*/
/*メニュー全体の設定*/
.sub .submenu {
	margin-bottom: 20px;	/*メニューブロックの下に空けるスペース*/
	border-top: solid 1px #dcdcdc;	/*上の線の線種、幅、色*/
}
/*メニュー１個ごとの設定*/
.sub .submenu li {
	background: #fff;	/*背景色*/
	border-bottom: solid 1px #dcdcdc;	/*下の線の線種、幅、色*/
}
.sub .submenu li a {
	text-decoration: none;
	display: block;
	padding: 5px 10px;	/*メニュー内の余白。上下、左右への設定。*/
}
/*liタグが入れ子になった場合*/
.sub .submenu li li {
	padding: 0px 10px;
	border: none;
}

/*サブコンテンツ内のbox1
---------------------------------------------------------------------------*/
.sub .box1,
.sub .widget_archive, .sub .widget_categories, .sub .widget_pages {
	padding: 15px;			/*ボックス内の余白*/
	margin-bottom: 20px;	/*ボックスの下に空けるスペース*/
	background: rgba(0,0,0,0.02);	/*背景色。rgbaは色設定で0,0,0は黒。0.02は透明度2%の事。*/
	border: solid 1px #dcdcdc;	/*線の線種、幅、色*/
	box-shadow: 0px 0px 1px 1px #fff inset;	/*ボックスの影。内側に白のラインを入れる。*/
}
/*box1内のメニューの設定*/
.sub .box1 .submenu {
	margin-bottom: 0px;
}

/*subコンテンツ内のlistボックス
---------------------------------------------------------------------------*/
/*ボックス１個あたりの設定*/
.sub .list-sub {
	border-bottom: 1px solid #dcdcdc;	/*下線の幅、線種、色*/
	font-size: 80%;		/*文字サイズ*/
	line-height: 1.2;	/*行間*/
	padding: 4%;		/*ボックス内の余白*/
	background: #fff;	/*背景色*/
	overflow: hidden;
}
/*１つ目のボックス*/
.sub h2 + .list-sub {
	border-top: 1px solid #dcdcdc;	/*上の線の幅、線種、色*/
}
/*h2タグ設定*/
.sub .list-sub h2 {
	padding: 0;clear: none;
	color: #d5889a;
}
/*h2タグの左側のアクセントのリセット*/
.sub .list-sub h2::first-letter {
	border-left: none;padding-left:0;
}
/*ボックス内の画像の設定*/
.sub .list-sub figure img {
	float: left;	/*左に回り込み*/
	margin-right: 10px;
	width: 25%;		/*画像幅*/
}
/*ボックス内の段落タグの設定*/
.sub .list-sub p {
	padding: 0;
}

/*subブロック内の検索ブロック
---------------------------------------------------------------------------*/
#searchform  {
	text-align: center;	/*文字をセンタリング*/
	/*padding: 20px 0;	上下、左右へのボックス内の余白*/
}
#searchform input {
	max-width: 60%;
}
/*デフォルトで出る「検索：」の文字を消す設定*/
#searchform .screen-reader-text {
	display: none;
}

/*ウィジェットカレンダー用
---------------------------------------------------------------------------*/
#wp-calendar {
	background: #fff;	/*背景色*/
	width: 100%;
	margin-bottom: 20px;
	text-align: center;
	font-size: 12px;
}
#wp-calendar, #wp-calendar th, #wp-calendar td {
	border: 1px solid #ccc;	/*テーブルの枠線の幅、線種、色*/
}
#wp-calendar a {
	color: #d5889a;	/*リンクテキストの色*/
}

/*カスタムフィールド出力用（擬似テーブル）
---------------------------------------------------------------------------*/
/*ブロック全体*/
ul.post-meta {
	border-top: 1px solid #ccc;	/*ブロックの一番上の線の幅、線種、色*/
	margin-bottom: 20px;
}
/*各行*/
ul.post-meta li {
	border-bottom: 1px solid #ccc;	/*各行ごとの下線の幅、線種、色*/
}
/*各行（左側ブロック）*/
ul.post-meta li .post-meta-key {
	display: inline-block;
	width: 150px;		/*幅*/
	background: #eee;	/*背景色*/
	padding: 10px;		/*ボックス内の余白*/
}

/*フッター設定
---------------------------------------------------------------------------*/
footer {
	clear: both;
	font-size: 85%;	/*文字サイズ*/
	background: pink;	/*背景色*/
	color: #fff;	/*文字色*/
}
footer a {
	text-decoration: none;
	color: #fff;	/*文字色*/
}
footer .pr {
	display: block;
	font-size: 80%;
}

/*フッターメニュー
---------------------------------------------------------------------------*/
/*ボックス全体*/
#footermenu {
	overflow: hidden;
	padding: 20px 0;
	text-align: center;
	font-size: 80%;	/*文字サイズ*/
}
#footermenu li {
	display: inline;
	padding: 10px;
}
#footermenu a {
	color: black;
	font-size: 1.4em;
}
#footermenu a:hover {
	color: rgba(255,255,255,0.7);
}

/*コピーライト
---------------------------------------------------------------------------*/
#copyright {
	clear: both;
	text-align: center;
	background: #333;	/*背景色*/
}

/*お知らせ用の設定
---------------------------------------------------------------------------*/
/*ボックス１個あたり*/
.news {
	padding: 5px 20px;	/*上下、左右へのボックス内の余白*/
}
/*日付ブロック*/
.news dt {
	float: left;	/*左に回り込み*/
	width: 7em;		/*幅。日付の出力を変更した際はここも調整して下さい。*/
	color: #d5889a;	/*文字色*/
}
/*アイコンとテキストブロック（日付以外の部分）*/
.news dd {
	padding-left: 7em;	/*左に空ける余白。上の日付のwidthと合わせる。*/
	position: relative;
	border-bottom: 1px solid #eee;	/*下線の幅、線種、色*/
}
/*段落タグ*/
.news p {
	padding: 0 !important;
}
/*コメント*/
.news .comment {
	padding-left: 7em;	/*左に空ける余白。上の「.news dt」や「.news dd」のwidthの値と同じか、「1」追加したぐらいでOK。*/
}
/*アイコン（共通）*/
.news .category a {
	display: block;
	text-decoration: none;
	text-align: center;
	width: 8em;		/*幅。ここを変更した場合は上の「.news .comment」の数字も合わせて変更する。*/
	position: absolute;
	top: 7px;	/*上下の配置バランスをここで微調整*/
	background: #999;	/*背景色*/
	color: #fff;		/*文字色*/
	border-radius: 2px;	/*角丸のサイズ*/
	font-size: 12px;	/*文字サイズ*/
	line-height: 1.8;	/*行間*/
	padding: 0 5px;		/*上下、左右へのアイコン内の余白*/
}
/*アイコン「news」*/
.news .category-news .category a {
	background: #d5889a;	/*背景色*/
	color: #FFF;			/*文字色*/
}

/*よく頂く質問ページ
---------------------------------------------------------------------------*/
/*ブロック全体*/
.faq {
	padding: 0px 20px;	/*上下、左右への余白*/
}
/*質問の設定*/
.faq dt {
	color: #d5889a;	/*文字色*/
	padding-top: 15px;
	margin-bottom: 10px;
}
/*回答の設定*/
.faq dd {
	border-bottom: 1px solid #ccc;	/*下線の幅、線種、色*/
	overflow: hidden;
	padding-bottom: 15px;
}
/*段落タグ*/
.faq p {
	padding: 0 !important;
}

/*テーブル
---------------------------------------------------------------------------*/
/*ta1,ta2共通設定*/
.ta1,
.ta2 {
	width: 96%;
	margin: 0 2% 30px;
}
.ta1, .ta1 td, .ta1 th,
.ta2, .ta2 td, .ta2 th {
	border: 1px solid #999;	/*テーブルの枠線の幅、線種、色*/
	line-height: 2;
	padding: 10px;	/*ボックス内の余白*/
	word-break: break-all;
}
/*テーブル１行目に入った見出し部分*/
.ta1 th.tamidashi,
.ta2 th.tamidashi {
	width: auto;
	text-align: left;	/*左よせ*/
	background: #cce6f6;	/*背景色*/
	font-weight: bold;
}
/*ta1の左側ボックス*/
.ta1 th {
	width: 150px;	/*幅*/
	text-align: center;	/*センタリング*/
	background: #f0f0f0;	/*背景色*/
	font-weight: normal;
}
/*ta1の左側ボックスに画像を入れた場合の設定*/
.ta1 th img {
	width: 100%;
}
/*ta2の左側ボックス*/
.ta2 th {
	background: #fffeba;	/*背景色*/
}
/*ta2の右側ボックス*/
.ta2 td {
	text-align: center;	/*センタリング*/
}
/*料金ページの追加設定（CMS用）*/
.ta1.price td {
	text-align: right;
}
.ta1.price tr.total th {
	background: #b7e0ee;
	font-size: 150%;
}
.ta1.price tr.total td {
	background: #deeff4;
	font-weight: bold;
	font-size: 150%;
}
/*ta1内のpタグ*/
.ta1 p {
	padding: 0 !important;
}

/*ボタン(btn)の設定
---------------------------------------------------------------------------*/
input[type="submit"].btn,
input[type="button"].btn {
	padding: 15px;	/*ボタン内の余白*/
	margin-bottom: 30px;
	border: 1px solid #ccc;	/*枠線の幅、線種、色*/
	border-radius: 3px;	/*角丸のサイズ*/
	background: linear-gradient(#fff, #eee);	/*グラデーション*/
}
button {
    border-color: none;
    border-style: none;
    border-width: 0;
    padding: 0;
    border-radius: 4px;
}
/*マウスオン時の設定*/
input[type="submit"].btn:hover,
input[type="button"].btn:hover {
	border: 1px solid #999;	/*枠線の幅、線種、色*/
	background: #fff;	/*背景色*/
	position: relative;top: 1px;left: 1px;	/*マウスオン時に上から1px、左から1px場所を移動する*/
}

/*PAGE TOP設定
---------------------------------------------------------------------------*/
#pagetop {
	clear: both;
	padding-top: 40px;
}
#pagetop a {
	text-decoration: none;text-align: center;display: block;float: right;
	color: #fff;		/*文字色*/
	font-size: 20px;	/*文字サイズ*/
	background: #d5889a;	/*背景色*/
	width: 60px;	/*幅*/
	line-height: 60px;	/*高さ*/
	margin-bottom: 20px;
}
/*マウスオン時*/
#pagetop a:hover {
	background: #333;	/*背景色*/
}

/*一覧ページのボックス内のアイコン
（CMSの場合は管理ページの「オプション1」～のプルダウンと、setup.phpの「オプション選択肢」に関連します）
---------------------------------------------------------------------------*/
/*option1,option2共通*/
span.option1, span.option2 {
	text-align: center;
	display: block;
	font-size: 10px;	/*文字サイズ*/
	width: 100px;		/*幅*/
	position: absolute;
	right: 0px;	/*ボックスに対して右から0pxの場所に配置*/
	top: 0px;	/*ボックスに対して上から0pxの場所に配置*/
	transform: rotate(45deg) translate(32px,-9px);	/**/
	color: #FFF;	/*文字色*/
	background: #666;	/*背景色*/
}
/*option1への追加設定*/
span.option1 {
	color: #FFF;		/*文字色*/
	background: #F00;	/*背景色*/
}
/*h2タグ内で使った場合のoption1とoption2*/
h2 span.option1, h2 span.option2 {
	text-shadow: none;
	width: auto;
	padding: 2px 5px;
	position: static;
	transform: none;
	display: inline-block;
	font-size: 15px;
	margin-left: 10px;
}

/*トップページのNEWアイコン
---------------------------------------------------------------------------*/
.newicon {
	background: #F00;	/*背景色*/
	color: #FFF;		/*文字色*/
	font-size: 70%;		/*文字サイズ*/
	line-height: 1.5;
	padding: 2px 5px;
	border-radius: 2px;
	margin: 0px 5px;
	vertical-align: text-top;
}

/*bg1
---------------------------------------------------------------------------*/
.bg1 {
	background: #f4f2ea url(../images/bg1.png);	/*背景色、背景画像の読み込み*/
}

/*ページ内メニュー（サービスページ内でジャンルを指定した場合に出る見出し下のメニュー）
---------------------------------------------------------------------------*/
ul.nav {text-align: center;padding-bottom: 10px;}
ul.nav li {display: inline;padding: 10px;}
ul.nav li.current-cat a {text-decoration: none;color: #d5889a;}

/*ページナビ
---------------------------------------------------------------------------*/
/*ボックス全体*/
.page-numbers {
	clear: both;
	text-align: center;
	padding-bottom: 5px;
	padding-top: 20px;
	margin-bottom: 20px;
}
/*ナビ１個あたりの設定*/
.page-numbers li {
	display: inline;
}
.page-numbers a {
	text-decoration: none;
	border: 1px solid #ccc;	/*枠線の幅、線種、色*/
	padding: 10px;			/*ボックス内の余白*/
}
/*現在表示中の設定*/
.page-numbers li .current,
.page-numbers span {
	border: 1px solid #ccc;	/*枠線の幅、線種、色*/
	padding: 10px;			/*ボックス内の余白*/
	font-weight: bold;		/*文字を太字に*/
	background: #eee;		/*背景色*/
	color: #ababab;			/*文字色*/
}
.page-numbers a span {
	background: #fff;		/*背景色*/
	border: 1px solid #ccc;	/*枠線の幅、線種、色*/
	padding: 10px;			/*ボックス内の余白*/
	margin: -11px;			/*調整。paddingとborderの数字を合わせてマイナスをつける*/
	color: #666;			/*文字色*/
}
/*マウスオン時の設定*/
.page-numbers a:hover,
.page-numbers a:hover span {
	background: #eee;	/*背景色*/
}
/*下の「.next」の設定の影響をリセット*/
.page-numbers .next {float: none;}

/*前の投稿、次の投稿
---------------------------------------------------------------------------*/
.back {float: left;}
.next {float: right;}

/*固定ページに子ページがある場合のナビメニュー
---------------------------------------------------------------------------*/
div.nav {text-align: center;} 
div.nav a {display: inline-block; margin: 0 5px 20px;}
div.nav a::before {content: "»"}

/*その他
---------------------------------------------------------------------------*/
.look {background: #eee;padding: 5px 10px;border-radius: 4px;}
.mb15,.mb1em {margin-bottom: 15px !important;}
.mb30 {margin-bottom: 30px !important;}
.p0 {padding:0 !important;}
.clear {clear: both;}
ul.disc {padding: 0em 25px 15px;list-style: disc;}
.color1, .color1 a {color: #F00;}
.pr {font-size: 10px;}
.wl {width: 96%;}
.ws {width: 50%;}
.c {text-align: center !important;}
.r {text-align: right !important;}
.l {text-align: left !important;}
/*img.fr {float: right;margin-left: 10px;margin-bottom: 10px;}*/
/*img.fl {float: left;margin-right: 10px;margin-bottom: 10px;}*/
.big1 {font-size: 200%;}
.mini1 {font-size: 11px;display: inline-block;line-height: 1.5;}
.sh {display: none;}



/*画面幅1200px以上の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (min-width:1200px){

/*inner共通
---------------------------------------------------------------------------*/
.inner {
	width: 1200px;	/*サイト幅*/
}

/*メインメニューとドロップダウンメニューの設定変更。
上の共通設定で、max-widthを1200pxにしており、メニュー数が５個なので、1200÷5=240pxになります。
---------------------------------------------------------------------------*/
#menubar li, #menubar ul.ddmenu {
	width: 200px;
}

}



/*画面幅800px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:800px){

/*inner共通
---------------------------------------------------------------------------*/
.inner {
	width: auto;
}
#footermenu a {
    font-size: 1em;
}

/*ヘッダー（ロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/
/*ロゴ画像*/
header #logo img {
	width: 250px;	/*画像幅*/
}

/* 追加分 */
#headermenu {
	right: 15%;
    bottom: 30px;
}
.box_txt {
	font-size: 12px;
}


/*文字サイズ変更ボタン（※文字サイズを「大」にした時の設定はchange.cssで行う）
---------------------------------------------------------------------------*/
/*ボタンブロック全体*/
#fsize {
	display: none;
}

/*メインメニュー
---------------------------------------------------------------------------*/
/*アニメーションのフレーム設定。全100コマアニメーションだと思って下さい。透明度(opacity)0%から透明度100%にする指定。*/
@keyframes menu1 {
0% {opacity: 0;}
100% {opacity: 1;}
}
/*スマホ用メニューを非表示から表示に切り替える*/
#menubar-s {
	display: block;
	overflow: hidden;
	position: fixed;
	top:100px;
	border-top: 1px solid #fff;
	width: 100%;
	z-index: 10;
	animation-name: menu1;		/*上のkeyframesの名前*/
	animation-duration: 0.5S;	/*アニメーションの実行時間。0.5秒。*/
	animation-fill-mode: both;	/*アニメーションの完了後、最後のキーフレームを維持する*/
}
/*メニュー１個あたりの設定*/
#menubar-s li a {
	display: block;text-decoration: none;
	padding: 15px 5%;
	border-bottom: 1px solid #fff;
	background: #d5889a;
	color: #fff;
	font-size: 150%;
}
/*PC用メニューを非表示にする*/
#menubar {
	display: none;
}

/*３本バーアイコン設定
---------------------------------------------------------------------------*/
/*３本バーブロック*/
#menubar_hdr {
	display: block;
	position: absolute;
	top: 7%;	/*上から3%の場所に配置*/
	right: 3%;	/*右から3%の場所に配置*/
}
/*アイコン共通設定*/
#menubar_hdr.close,
#menubar_hdr.open {
	width: 50px;	/*幅*/
	height: 50px;	/*高さ*/
	border: 1px solid #000;	/*枠線の幅、線種、色*/
}
/*三本バーアイコン*/
#menubar_hdr.close {
	background: #fff url(../images/icon_menu.png) no-repeat center top/50px;
}
/*閉じるアイコン*/
#menubar_hdr.open {
	background: #fff url(../images/icon_menu.png) no-repeat center bottom/50px;
}

/*コンテンツ（mainとsubを囲むブロック）
---------------------------------------------------------------------------*/
.contents {
	padding: 0%;
   margin:80px 0 auto;
}

/*listブロック（※２カラムも３カラムと１列レイアウトと同じように設定しなおす）
---------------------------------------------------------------------------*/
/*listブロック設定*/
.list {
	margin: 0 !important;
	padding: 4% !important;
	float: none !important;
	width: auto !important;
	box-shadow: none;
	border-top: 1px solid #ccc;
}
.list:last-of-type {
	border-bottom: 1px solid #ccc;
	margin-bottom: 20px !important;
}
/*h4タグ設定*/
.list h4 {
	font-size: 150% !important;
}
/*段落タグ設定*/
.list p {
	font-size: 100% !important;
	line-height: 1.8 !important;
	height: auto !important;
}
	
/*main,subコンテンツ
---------------------------------------------------------------------------*/
.main, .sub {
	float: none;
	width: auto;
}

/*PAGE TOP設定
---------------------------------------------------------------------------*/
#pagetop {
	margin-right: 3%;
}

/*その他
---------------------------------------------------------------------------*/
body.s-n .sub,body.s-n #footermenu,.m-n {display: none;}
}

	.inquiry{
		width:100%;
	}	
	div.wpcf7{
		margin:0 4%;
	}	
/*Contact Form 7カスタマイズ*/
/*スマホContact Form 7カスタマイズ*/
@media(max-width:500px){
.inquiry th,.inquiry td {
 display:block!important;
 width:100%!important;
 border-top:none!important;
 -webkit-box-sizing:border-box!important;
 -moz-box-sizing:border-box!important;
 box-sizing:border-box!important;
}
.inquiry tr:first-child th{
 border-top:1px solid #d7d7d7!important;
}
/* 必須・任意のサイズ調整 */	
.inquiry .haveto,.inquiry .any {	
font-size:10px;
}}
/*見出し欄*/
.inquiry th{
 font-size:14px;
 color:#444;
 padding-right:5px;
 width:30%;
 background:#f7f7f7;
 border:solid 1px #d7d7d7;
position:relative;
}
/*通常欄*/
.inquiry td{
 font-size:13px;
 border:solid 1px #d7d7d7;	
}
/*横の行とテーブル全体*/
.entry-content .inquiry tr,.entry-content table{
 border:solid 1px #d7d7d7;	
}
/*必須の調整*/
.haveto{
 font-size:7px;
 padding:5px 16px;
 background:#ff9393;
 color:#fff;
 border-radius:2px;
 margin-right:5px;
 position:absolute;
 right:5%;
}
/*任意の調整*/
.any{
 font-size:7px;
 padding:5px 16px;
 background:#93c9ff;
 color:#fff;
 border-radius:2px;
 margin-right:5px;
 position:absolute;
 right:5%;
}
/*ラジオボタンを縦並び指定*/
.verticallist .wpcf7-list-item{
 display:block;
}
/*送信ボタンのデザイン変更*/
#formbtn{
 display: block;
 padding:15px;
 width:350px;
 background:#ffaa56;
 color:#fff;
 font-size:18px;
 font-weight:bold;	 
 border-radius:2px;
 margin:25px auto 0;
}
/*送信ボタンマウスホバー時*/
#formbtn:hover{
 background:#fff;
 color:#ffaa56;
 border:2px solid #ffaa56;
}

@media screen and (min-width:768px){
	div.wpcf7{
		margin:0 5%;
	}
	.inquiry th{
		padding:12px;
		text-align:left;
	}
}
@media screen and (max-width:768px){
  #formbtn{
		    width: 100%;
	}
	
}