﻿
/* WEBフォント明朝 使う場合は、htmlに↓記載
<link href="https://fonts.googleapis.com/css?family=Noto+Serif+JP:400,500,600,700,900&amp;subset=japanese" rel="stylesheet">
*/

/* ===========================
WEBフォント明朝
============================*/
/*
* {
	font-family: 'Noto Serif JP', sans-serif;
	word-wrap: break-word;
}
*/

/* ===========================
layout初期化
============================*/

.block *, .block *:before, .block *:after {
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	word-wrap: break-word;
/*
	margin:0;
	padding:0;
	line-height:1.5em;
*/
}

.block * font, .block * span, .block * strong { display: inline-block; }
.block * font.pc_hide, .block * span.pc_hide, .block * strong.pc_hide { display: none; }
.block * font.sm_hide, .block * span.sm_hide, .block * strong.sm_hide { display: inline-block; }
.block * font.tablet_hide, .block * span.tablet_hide, .block * strong.tablet_hide { display: none; }


/* ===========================
レイアウト
============================*/

.fee_th { text-align:right; }
.fee_td { text-align:left; }


/* ===========================
見出しと内容
============================*/
* .title {
	font-size:120%;
	font-weight:bold;
	margin-bottom:0.7em;
	border-bottom:1px #ccc dotted;
	padding-bottom:0.2em;
}

* .menu_title {
	margin:0em auto 0.6em;
	font-size:110%;
	font-weight:bold;
	padding:0em;
	text-align:center;
}

.kingaku {
	text-align:center;
	font-size:100%;
}

.menu_naiyou {
	text-align:center;
	margin-bottom:0.4em;
	font-size:100%;
}

.com { clear:both; }

.new_ico {
	font-size:80%;
	background-color: #f00;
	color:#fff;
	font-weight:bold;
	padding:0.4em 0.5em 0.2em;
	line-height: 100%;
	border-radius: 5px;
}

/* ===========================
お知らせ枠
============================*/
.oshirase { font-family: 'Noto Serif JP', sans-serif; word-wrap: break-word; border-style:solid; border-width:2px; border-radius:0.4em; padding:1em 1.5em; margin:0 auto 1em; width:100%; max-width:1200px; }
.oshirase_ttl { font-size:130%; font-weight:bold; padding-bottom:0.3em; border-bottom-style:dotted; border-bottom-width:1px; margin-bottom:0.5em; }
.oshirase_ttl_sub { font-size:120%; font-weight:bold; padding-bottom:0.2em; margin-bottom:0.5em; margin-top:1em; }
.oshirase_danraku { font-size:100%; line-height:1.5em; margin-bottom:0.6em; word-wrap:normal; }
.oshirase_shime { text-align:right; width:90%; margin:0 auto; }
.oshirase_shime div { display:inline-block; text-align:left; }

.oshirase.color_red{ border-color:#BD0003; }
.color_red .oshirase_ttl { color:#d00; border-bottom-color:#BD0003; }

.oshirase.color_blue{ border-color:#2958B8; }
.color_blue .oshirase_ttl { color:#143882; border-bottom-color:#2958B8; }

.oshirase.color_green{ border-color:#3E872C; }
.color_green .oshirase_ttl { color:#2A631C; border-bottom-color:#3E872C; }

.oshirase.color_grd.grd_red {
  background: linear-gradient(to bottom right, #D76D7A, #BD273A);
	border-style:none;
}

.oshirase.color_grd.grd_greenblue {
  background: linear-gradient(to bottom right, #38A671, #4882DC);
	border-style:none;
}

.oshirase.color_grd.grd_orange {
  background: linear-gradient(to bottom right, #FFCD00, #FF6E00);
	border-style:none;
}


/* ===========================
flexbox
============================*/
.fb_div, .fb_div *, .fb_div_center, .fb_div_center *, .fb_div_left, .fb_div_left * {
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	word-wrap: break-word;
}


/*　均等並び　*/
.fb_div {
	width:100%;
	margin:0.7em auto 0.5em;
	text-align:center;
	display: flex;
 align-items: flex-start;
	justify-content: space-between;
  align-items: stretch;
	flex-wrap: wrap;
}

/*　中央寄せ　*/
.fb_div_center {
	width:100%;
	margin:0.7em auto 0.5em;
	text-align:center;
	display: flex;
 align-items: flex-start;
justify-content: center;
  align-items: stretch;
	flex-wrap: wrap;
}

/*　左寄せ（普通？）　*/
.fb_div_left {
	width:100%;
	margin:0;
	padding:0;
	text-align:left;
	display: flex;
justify-content: flex-start;
  align-items: stretch;
}


.flx_item {
	margin:0 0.5em;
	flex:1;
}


.flx_item * img, .fb_div * img, .fb_div_center * img, .fb_div_left * img {
	width:100%;
	margin-bottom:8px;
}

.col_12p12 {
	width:100%;
	margin:1em 0em 0.6em;
	padding:2%;
}
	
.col_1p12, .col_2p12, .col_2p10, .col_3p12, .col_4p12, .col_5p12, .col_6p12, .col_7p12, .col_8p12, .col_9p12, .col_10p12, .col_11p12, .col_12p12
{ margin-top:0.7em; margin-bottom:0.7em; padding:0.3em; }

.photo_1, .photo_2, .photo_3, .photo_4, .photo_5, .photo_6, .photo_7, .photo_8, .photo_9, .photo_10
{ margin-top:0.3em; margin-bottom:0.3em; padding:0.5em; }

.photo_1 img, .photo_2 img, .photo_3 img, .photo_4 img, .photo_5 img, .photo_6 img, .photo_7 img, .photo_8 img, .photo_9 img, .photo_10 img 
{ box-shadow: 0px 0px 8px 1px rgba(0,0,0,0.2); }

.col_12p12 { width:100%; }	/* 12分の12 */
.col_11p12 { width:90.5%; }	/* 12分の11 */
.col_10p12 { width:82%; }		/* 12分の10 */
.col_9p12 { width:73.8%; }	/* 12分の9 */
.col_8p12 { width:65.6%; }	/* 12分の8 */
.col_7p12 { width:57.4%; }	/* 12分の7 */
.col_6p12 { width:49.2%; }	/* 12分の6 半分 */
.col_5p12 { width:41.0%; }	/* 12分の5 */
.col_4p12 { width:32.8%; }	/* 12分の4 3分割 */
.col_3p12 { width:24.6%; }	/* 12分の3 4分割 */
.col_2p10 { width:19.7%; }	/* 10分の2 5分割 */
.col_2p12 { width:16.4%; }	/* 12分の2 6分割 */
.col_1p12 { width:8.2%; }		/* 12分の1 12分割 */

.photo_1 { width:100%; }	/* 1枚 */
.photo_2 { width:49.7%; }	/* 2枚 */
.photo_3 { width:33.2%; }	/* 3枚 */
.photo_4 { width:24.8%; }	/* 4枚 */
.photo_5 { width:19.8%; }	/* 5枚 */
.photo_6 { width:15.8%; }	/* 6枚 */
.photo_7 { width:13.8%; }	/* 7枚 */
.photo_8 { width:12.3%; }	/* 8枚 */
.photo_9 { width:11%; }		/* 9枚 */
.photo_10 { width:9.7%; }	/* 10枚 */

.bk_white {
	background-color: #FFFFFF;
	box-shadow: 0px 0px 8px 1px rgba(0,0,0,0.2);
	padding:15px;
}

/* ===========================
リスト
============================*/
/* リストタグ用 */
.ol_lst, .ul_lst { margin:0.5em 2em 0.5em 1.7em; }
.ol_lst li, .ul_lst li { margin-bottom:0.5em; line-height:1.5em; }
* .ol_lst li, * .ul_lst li .ol_lst li { list-style-type:decimal; }
* .ul_lst li, * .ol_lst li .ul_lst li { list-style-type:disc; }

/* リストタグを使わないとき用 */
* .txt_list { margin-left:1.5em; text-indent:-1.3em; margin-bottom:0.4em; line-height:1.4em; }
* .txt_list * { text-indent:0; }

* .list_naiyou { margin-left:1em; }

/* ===========================
ボタン
============================*/
	
/* a タグ入れるブロックの設定  */
.btn_div { margin-top:1em; margin-bottom:1em; }
.btn_div * { font-family: 'Noto Serif JP', sans-serif; word-wrap: break-word; }

/* a タグ入れるブロック内の a タグの設定  */
.fb_div a, .btn_div a, .fb_div a:link, .btn_div a:link, .fb_div a:visited, .btn_div a:visited,
.fb_div_center a, .fb_div_center a, .fb_div_center a:link, .fb_div_center a:link, .fb_div_center a:visited, .fb_div_center a:visited,
.fb_div_left a, .fb_div_left a, .fb_div_left a:link, .fb_div_left a:link, .fb_div_left a:visited, .fb_div_left a:visited {
	text-decoration:none;
	text-align:center;
	font-weight:bold;
}

/* ボタン形状 */
.btn_ll, .btn_l, .btn_m, .btn_s, .btn_ss {
	margin:0;
    border-radius: 10px;
}

/* ボタン大きさ */
.btn_ll { padding:1em; font-size:140%; border-radius: 12px; font-weight: bold; }
.btn_l { padding:1em; font-size:130%; border-radius: 10px; font-weight: bold; }
.btn_m { padding:0.7em; font-size:120%; border-radius: 7px; font-weight:normal; }
.btn_s { padding:0.3em 0.5em; font-size:105%; border-radius: 5x; font-weight:normal; }
.btn_ss { padding:0.2em 0.5em; font-size:100%; border-radius: 3x; font-weight:normal; }

/* ボタンスタイル */
.btn_blk { display:block; }
.btn_inblk { display:inline-block; margin-left:0.2em; margin-right:0.2em; }

/* ボタン色 */
.btn_blue, .btn_blue:link, .btn_blue:visited { background-color:#0E2374; color:#fff; }
.btn_blue:hover { background-color:#0936C4; color:#fff; }

.btn_lightblue, .btn_lightblue:link, .btn_lightblue:visited { background-color:#1471BD; color:#fff; }
.btn_lightblue:hover { background-color:#378DD3; color:#002D52; }

.btn_green, .btn_green:link, .btn_green:visited { background-color:#1B421A; color:#fff; }
.btn_green:hover { background-color:#4C9443; color:#fff; }

.btn_lightgreen, .btn_lightgreen:link, .btn_lightgreen:visited { background-color:#20721E; color:#fff; }
.btn_lightgreen:hover { background-color:#5FC053; color:#001200; }

.btn_red, .btn_red:link, .btn_red:visited { background-color:#730606; color:#fff; }
.btn_red:hover { background-color:#B41818; color:#fff; }

.btn_lightred, .btn_lightred:link, .btn_lightred:visited { background-color:#AA1919; color:#fff; }
.btn_lightred:hover { background-color:#FF7F7F; color:#1B0000; }

.btn_lightpurple, .btn_lightpurple:link, .btn_lightpurple:visited { background-color:#4A2C94; color:#ffff; }
.btn_lightpurple:hover { background-color:#8D6FD9; color:#0E0032; }

.btn_pink, .btn_pink:link, .btn_pink:visited { background-color:#D34560; color:#FFFFFF; }
.btn_pink:hover { background-color:#E590A0; color:#1E0008; }

.btn_orange, .btn_orange:link, .btn_orange:visited { background-color:#FF7600; color:#ffff; }
.btn_orange:hover { background-color:#FF9B46; color:#271200; }

.btn_yellow, .btn_yellow:link, .btn_yellow:visited { background-color:#D1A900; color:#ffff; }
.btn_yellow:hover { background-color:#E5C749; color:#2B2000; }

.btn_purple, .btn_purple:link, .btn_purple:visited { background-color:#351864; color:#ffff; }
.btn_purple:hover { background-color:#6D4AC1; color:#fff; }

.btn_gold, .btn_gold:link, .btn_gold:visited { background-color:#7F6F29; color:#fff; }
.btn_gold:hover { background-color:#D0CD7D; color:#413104; }

.btn_brown, .btn_brown:link, .btn_brown:visited { background-color:#372216; color:#fff; }
.btn_brown:hover { background-color:#563621; color:#fff; }

.btn_gray, .btn_gray:link, .btn_gray:visited { background-color:#323232; color:#fff; }
.btn_gray:hover { background-color:#ABABAB; color:#000; }

.btn_white, .btn_white:link, .btn_white:visited { background-color:#eeeeee; color:#373737; }
.btn_white:hover { background-color:#CD585A; color:#fff; }

.btn_grd_red {
  background: linear-gradient(to bottom right, #D76D7A, #BD273A);
	color:#fff;
}
.btn_grd_red:hover {
  background: linear-gradient(to bottom right, #7ED76D, #1A9B0B);
	color:#fff;
}

.btn_grd_blue {
  background: linear-gradient(to bottom right, #3A9BD1, #102C97);
	color:#fff;
}
.btn_grd_blue:hover {
  background: linear-gradient(to bottom right, #E49A2E, #E46B2C);
	color:#fff;
}

.btn_grd_green {
  background: linear-gradient(to bottom right, #319E48, #006732);
	color:#fff;
}
.btn_grd_green:hover {
  background: linear-gradient(to bottom right, #C95F5F, #B02020);
	color:#fff;
}

.btn_grd_greenblue {
  background: linear-gradient(to bottom right, #38A671, #4882DC);
	color:#fff;
}
.btn_grd_greenblue:hover {
  background: linear-gradient(to bottom right, #C95F5F, #B02020);
	color:#fff;
}

.btn_grd_orange {
  background: linear-gradient(to bottom right, #FFCD00, #FF6E00);
	color:#fff;
}
.btn_grd_orange:hover {
  background: linear-gradient(to bottom right, #7C67E8, #4926C0);
	color:#fff;
}

.btn_grd_gray {
  background: linear-gradient(to bottom right, #D5D5D5, #434343);
	border:1px #666 solid;
	color:#292929;
}
.btn_grd_gray:hover {
  background: linear-gradient(to bottom right, #E86767, #C02525);
	border:1px #BC4444 solid;
	color:#fff;
}


/* ===========================
YOU TUBE
============================*/
.youtube {
	position:relative;
	width: 100%;
	max-width: 960px;	/* 最大幅を設定するとき指定 */
	margin:0px auto;
}

/* 最大幅を設定するとき指定 */
.youtube::before {
	content: "";
	display: block;
	width: 100%;
	padding-top: 56.25%;
}

/* 幅いっぱい・最大幅設定時　共通 */
.youtube iframe {
	position: absolute;
	top: 0;
	left: 0;
	width:100% !important;
	height:100% !important;
}


/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/
/* タブレットサイズ？*/

@media all and (min-width:751px) and (max-width:919px){
/*-----------------------------------------------*/

	.block * font.pc_hide, .block * span.pc_hide, .block * strong.pc_hide { display: inline-block; }
	.block * font.sm_hide, .block * span.sm_hide, .block * strong.sm_hide { display: none; }
	.block * font.tablet_hide, .block * span.tablet_hide, .block * strong.tablet_hide { display: none; }
	
	.col_1p12, .col_2p12, .col_2p10, .col_3p12, .col_4p12, .col_5p12, .col_6p12, .col_7p12, .col_8p12, .col_9p12, .col_10p12, .col_11p12, .col_12p12
	{ margin-top:0.6em; margin-bottom:0.6em; padding:0.2em; }
		
	.photo_4 { width:49.8%; }
	.photo_5, .photo_6 { width:33.2%; }
	.photo_7, .photo_8 { width:24.6%; }
	.photo_9, .photo_10 { width:16.4%; }

	
/*-----------------------------------------------*/
}

/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/
/* スマホサイズ？*/

@media all and (max-width:750px){
/*-----------------------------------------------*/

	.block * font.pc_hide, .block * span.pc_hide, .block * strong.pc_hide { display: inline-block; }
	.block * font.sm_hide, .block * span.sm_hide, .block * strong.sm_hide { display: none; }
	.block * font.tablet_hide, .block * span.tablet_hide, .block * strong.tablet_hide { display: none; }
	
	.col_1p12, .col_2p12, .col_2p10, .col_3p12, .col_4p12, .col_5p12, .col_6p12, .col_7p12, .col_8p12, .col_9p12, .col_10p12, .col_11p12, .col_12p12
	{ margin-top:0.5em; margin-bottom:0.5em; padding:0.1em; width:100%; }

	.photo_2, .photo_3, .photo_4 { width:100%; }
	.photo_5, .photo_6, .photo_7 { width:49.8%; }
	.photo_8, .photo_9, .photo_10 { width:33.2%; }
	
	.fee_th { margin-bottom:0; }
	.fee_th, .fee_td { text-align:center; }

/*-----------------------------------------------*/
}

