@charset "utf-8";

p{margin-bottom:0.6em;}
.margin_0{margin-bottom:0!important;}
.margin_02{margin-bottom:0.2em!important;}
.margin_03{margin-bottom:0.3em!important;}
.margin_05{margin-bottom:0.5em!important;}
.margin_1{margin-bottom:1em!important;}
.margin_2{margin-bottom:2em!important;}
.padding_0{padding:0!important;}/* 枠内に座布団を敷くときに使用*/

.text_field_top{padding:0.3em 1em;}/* 枠内のテキストの調整*/
.text_field{padding:0.7em 1em;}
.text_field_high{padding:1.5em 1em;}
.text_field_wide{padding:1em 2em!important;}
.tsume {font-feature-settings: "palt" 1;}/* 文字ツメ*/
.tsume_tsume{letter-spacing: -0.1em;}
.underline{border-bottom: 1px dotted;}

/* 段組 */
.four_col{width:23.8%; float:left;margin-right:1.5%;margin-bottom:1.5%;overflow:hidden;}
.four_col:nth-child(4n) {margin-right:0%;}
.two_col{width:48.5%; float:left;margin-right:3%;margin-bottom:3%;}
.two_col:nth-child(even) {margin-right:0%;}
.three_col{width:31.3%; float:left; margin-right:3%;margin-bottom:3%;}
.three_col:nth-child(3n) {margin-right:0%;}
.six_col{width:15%; float:left; margin-right:1.5%;}


@media screen and (max-width: 680px) {
	.two_col{width:100%; float:none;margin-right:0%;margin-bottom:2em;}
}

@media screen and (max-width: 680px) {
	.four_col{width:48.5%; float:left;margin-right:3%;margin-bottom:3%;}
	.four_col:nth-child(4n) {margin-right:0%;}
	.four_col:nth-child(even) {margin-right:0%;}
}

@media screen and (max-width: 680px) {
	.three_col{width:48.5%; float:left;margin-right:3%;margin-bottom:3%;}
	.three_col:nth-child(even) {margin-right:0%;}
}

.word_col{width:60%; float:left;margin-right:2%;margin-bottom:2%;}
.photo_col{width:37%; float:right;margin-bottom:2%;}
@media screen and (max-width: 760px) {.photo_col{width:60%; float:none;}.word_col{width:100%; float:none;}}

/* 
@media screen and (max-width: 480px) {
	.three_col{width:100%; float:none;margin-right:0%;margin-bottom:1.5em;}
	.three_col_main img{width:80%;margin-top:1em;}
}
*/
/* ■■■■■一般 ■■■■■ */
.inline_it{display:inline-block;}
.block_it{display:block;}

/* ボタンやホバー*/
.bottun{padding:0.2em 0.6em; background-color:rgba(105,78,46,0.2);}
.bottun:hover{background-color:rgba(105,78,46,0.5);}

.hover_it a {outline: none;text-decoration: none;}
.hover_it a:link, .hover_it a:visited, .hover_it a:hover, .hover_it a:active {text-decoration: none;color: rgb(80,80,80);}
.hover_it:hover{background-color: rgba(105,78,46,0.15); transition: 0.5s ease;}
.hover_img:hover{opacity: 0.8;}

.left_bar{border-left:5px solid rgb(140,120,100);padding-left:0.6em;}



/* 文字の大きさ*/
.section_midashi{text-align: center; font-size:1.7rem;line-height:2rem;color:rgb(105,78,46); padding:0em 0em 1em 0em;}
.midashi{font-size: 1.2em; color:rgb(30,30,30);font-weight:bold;line-height:1.5em;}

strong{color:rgb(30,30,30);font-weight:bold;}
.strong{color:rgb(30,30,30);font-weight:bold;}
.stronger{color:rgb(30,30,30);font-size:1.1em;font-weight:bold;}
.strongest{font-size:1.2em;font-weight:bold;}
.larger{font-size:1.2em;font-weight:bold;line-height:1.5; }
.largest{font-size:1.4em;font-weight:bold;line-height:1.3;}
small{font-size:0.9em;}
.small{font-size:0.9em;}
.smaller{font-size:0.85em;}
.smallest{font-size:0.75em;}
.color_brown{color:rgb(105,78,46);}
.color_blue{color:rgb(80,100,180);}
/* スタイル付きリスト*/

ul.liststyle{margin-left:1em;}
ul.liststyle li:before{content: '＊';margin-left:-1em;}

.indent_0 {text-indent:0em;}
.indent_1 {padding-left:1em;text-indent:-1em;}
.indent_2 {padding-left:2em;text-indent:-2em;}
.indent_3 {padding-left:3em;text-indent:-3em;}
.indent_4 {padding-left:4em;text-indent:-4em;}
.indent_5 {padding-left:5em;text-indent:-5em;}
.indent_6 {padding-left:6em;text-indent:-6em;}
.indent_7 {padding-left:7em;text-indent:-7em;}
.indent_time{padding-left:5.5em;text-indent:-5.5em;}

/* 文字装飾*/
.zabuton{color:rgb(255,255,255);background-color:rgb(105,78,46);padding: 0.2em 0.6em;}
.zabuton_waku{border: 1px dotted rgb(105,78,46);padding: 0.2em 0.6em;}
.zabuton_waku_light{border: 1px dotted rgb(160,140,120);padding: 0.2em 0.6em;}
.zabuton_light{background-color:rgb(235,235,220);padding: 0.2em 0.6em;}
.zabuton_purple{color:rgb(255,255,255);background-color:rgb(110,35,100);padding: 0.2em 0.6em;}
.zabuton_pink{color:rgb(255,255,255);background-color:rgb(228,108,130);padding: 0.2em 0.6em;}
.zabuton_brown{color:rgb(255,255,255);background-color:rgb(170,120,50);padding: 0.2em 0.6em;}
.zabuton_red{color:rgb(255,255,255);background-color:red;padding: 0.2em 0.6em;}
.zabuton_blue{color:rgb(255,255,255);background-color:rgb(80,100,180);padding: 0.2em 0.6em;}
.zabuton_green{color:rgb(255,255,255);background-color:rgb(50,120,50);padding: 0.2em 0.6em;}
.zabuton_black{color:rgb(255,255,255);background-color:rgb(0,0,0);padding: 0.2em 0.6em;}
.zabuton_hoike{color:rgb(255,255,255);background-color:rgb(144,58,101);padding: 0.2em 0.6em;}
.zabuton_ws1{color:rgb(255,255,255);background-color:rgb(101,66,43);padding: 0.2em 0.6em;}
.zabuton_ws2{color:rgb(255,255,255);background-color:rgb(94,40,97);padding: 0.2em 0.6em;}

/* 段落*/
hr.line {visibility:visible;border:none;border-bottom:solid 1px rgb(180,180,180);height:1px;clear:both;padding:0em;margin-bottom:0.5em; margin-top:0.5em;}
hr.dott {visibility:visible;border:none;border-bottom:dotted 1px rgb(105,78,46);height:1px;clear:both;padding:0em;margin-bottom:0.5em; margin-top:0.5em;;}
hr {visibility:hidden;clear:both;margin-bottom:0.5em;}


/* 写真と文字の左右寄せ*/
.photo_left{float: left; margin:0em 1em 0.2em 0em; }/* 画像 */
.photo_right{float: right; margin:0em 0em 0.2em 1em; }/* 画像 */
.center{text-align: center; }
.right{text-align: right; }
.left{text-align: left; }
.icon_1em{height:1em;vertical-align: text-bottom;padding-right:5px;}
/* 写真の大きさ*/
.halfsize{width:45%;}
.middlesize{width:35%;}
.smallsize{width:25%;}

@media screen and (max-width: 760px) {.halfsize{width:40%;}.middlesize{width:30%;}
.smallsize{width:30%;}}



/* ■■■■■■■■■■■■■■■■■■■■ */
/* ■■■■■■■■バーガーメニュー■■■■■■■■*/
/* ■■■■■■■■■■■■■■■■■■■■ */
/* ------ Anchor その他------ */
nav li a {outline: none;text-decoration:none;color: rgb(250,240,230);}
nav li a:link, nav li a:visited, nav li a:hover, nav li a:active {text-decoration:none;color: rgb(250,240,230);}

/* バーガーボタン*/
#navToggle {
	z-index:100;background-color:rgb(0,0,0);
	display:none; /*通常時は非表示にしておきます*/
	position:absolute; /*bodyに対しての絶対位置指定です*/
	right:30px; top:20px; width:40px; height:40px; cursor:pointer}
#navToggle div {position:relative;margin:7px 6px 6px 6px;} /*spanの絶対位置指定の親にします*/
#navToggle span {display:block; position:absolute; /*#navToggle div に対して*/
	width:100%; border-bottom:solid 3px rgb(255,255,255);
	-webkit-transition: .35s ease-in-out;
	-moz-transition: .35s ease-in-out;
	transition: .35s ease-in-out}
#navToggle span:nth-child(1) {top:0}
#navToggle span:nth-child(2) {top:11px}
#navToggle span:nth-child(3) {top:22px}
/* メニューの要素*/
nav{float:right;text-align: right; position:absolute; /*bodyに対しての絶対位置指定です*/
	top:0px;max-width: 980px; width:94%; }
nav ul {margin: 25px 0px;}
nav li {margin: 0.9rem 0;}
nav li a{padding-top:0.5em; padding-bottom:0.5em; padding-right:1em; padding-left:1em; text-decoration: none; border-left: solid 5px rgb(0,0,0);background-color: rgba(105,78,46,0.9); 
	-moz-transition-property:padding-left;
	-moz-transition-duration: 0.5s;
	-moz-transition-timing-function: ease;
	-moz-transition-delay: 0s;
	-webkit-transition-property:padding-left;
	-webkit-transition-duration: 0.5s;
	-webkit-transition-timing-function: ease;
	-webkit-transition-delay: 0s;
	transition-property:padding-left;
	transition-duration: 0.5s;
	transition-timing-function: ease;
	transition-delay: 0s;}
nav li a:hover{padding-top:0.5em; padding-bottom:0.5em; background-color: rgba(80,80,150,0.8);}
nav li .active_page{padding-top:0.5em; padding-bottom:0.5em; padding-right:2em; padding-left:2em; text-decoration: none; border-left: solid 5px rgba(255,255,255,0.5);background-color: rgba(0,0,0,0.7); color:rgb(255,255,255);}
nav li .active_page_front{padding-top:0.5em; padding-bottom:0.5em; padding-right:2em; padding-left:2em; text-decoration: none; border-left: solid 5px rgba(255,255,255,0.5);background-color: rgba(105,78,46,0.5); color:rgb(255,255,255);}

/* ■■■■■ YouTubeレスポンシブル ■■■■■ */
iframe{width:100% !important;}
.iframeBox{position:relative;width:100%;}
.iframeBox iframe{position:absolute;top:0;left:0;width:100% !important;height:100% !important}



/*-----------------------------------------------------	*/
/*	for - 760px		800			*/
/*-----------------------------------------------------	*/

@media screen and (max-width: 920px) {
/* ■■■■■■■■バーガーメニュー■■■■■■■■ */
/*nav要素は絶対位置指定にして、ビューの外側に置いて見えなくします。
nav の中の ul li は横並びを解除して縦組みにレイアウトし直します。*/
nav {position: absolute; /*bodyに対しての絶対位置*/
	right:3%;
	margin-top:2em;
	z-index:50;
	top: -600px; /*通常時はビュー外*/
	font-size: 100%;/*スマホでは大きく*/
	-webkit-transition:.5s ease-in-out; /*transitionで動きを*/
	-moz-transition:.5s ease-in-out;
	transition:.5s ease-in-out;}
/*メニューのレイアウト*/
nav ul {margin: 50px 0px;}
nav li {margin: 2em 0;}
nav li a {padding: 1em 2em; text-decoration: none; border-left: solid 5px rgb(0,0,0);background-color: rgba(105,78,46,0.9); color:rgb(255,255,255); }
nav li a:hover{padding: 1em 2em;text-decoration: none; border-left: solid 5px rgb(0,0,0);background-color: rgba(105,78,46,0.8); }
nav li .active_page{padding: 1em 2em; }

/* Toggle(Button) */
/*display:noneだったボタンを display:blockにして表示します*/
#navToggle {display:block}
 
/* Click Toggle(Button) */
/*ここから jQueryで header要素に付けた「.openNav」を利用します*/
/*.openNavが付いた要素内のボタン（#navToggle）内のspanへの指定*/
/*最初のspanをマイナス45度に　2番目と3番目のspanを45度に*/
.openNav #navToggle span:nth-child(1) {
	top: 11px;
	-webkit-transform:rotate(-45deg);
	-moz-transform:rotate(-45deg);
	transform:rotate(-45deg)}
.openNav #navToggle span:nth-child(2),
.openNav #navToggle span:nth-child(3) {
	top: 11px;
	-webkit-transform:rotate(45deg);
	-moz-transform:rotate(45deg);
	transform:rotate(45deg)}
 
/*header menu*/
/*.openNavが付いた要素の中のnavを 縦方向に351px移動（=表示される）*/
.openNav nav {
    -moz-transform: translateY(600px);
    -webkit-transform: translateY(600px);
    transform: translateY(600px)}
}