@charset "utf-8";
/*
Theme Name: kanham2021
Theme URI: ★ テーマの公式サイトなどのURL（空欄でも可） ★
Author: Yamada Shokai@ikeda
Tags: 
Version: 0.1.2
*/

/* 

Primary color:#337ab7
Secondry color:#2e6da4
Link color:#B73879
hover color:#DED580
base color:#BBB9EA

*/


/* general */

*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}

/* 変数指定 */

:root{
	--main_color:#337AB7;
	--sub_color:#2e6da4;
	--text_color:#242834;
    --back_color:#F3F1F1;
	--box_color:#D5E0F1;
}


/* fontsize reset */
html {
	font-size: 62.5%; /* 1rem -> 10px; */
}


body{
	font-family: "Rounded Mplus 1c","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
	font-size:1.6em;
	line-height: 2rem !important;
	color:var(--text_color)
}

.entry-content{
	background-color:var(--back_color);
}


/* テキスト装飾 */

.orange{
	color:#ff6600;
}

.green{
	color:#00cc33;
}

.yellow{
	color:#eeee22;
}

.red{
    color:#d7003a;
}

.bold{
	font-weight:bold;
}

.mincho{
	font-family: Georgia, "游明朝体", "YuMincho", "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", "HiraMinProN-W3", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}

.fs1{
	font-size:1rem;
}

.fs12{
	font-size:1.2rem;
}

.fs14{
	font-size:1.4rem;
}

.fs16{
	font-size:1.6rem;
}

.fs2{
	font-size:2rem;
}

.fs24{
	font-size:2.4rem;
}

/* 配置*/
.center,
.pic_box img{
	display:block !important;
	margin:0 auto !important;
}

.right{
	display:block !important;
	margin-left:auto !important;
}

.t_center{
	text-align:center;
}

.t_right{
	text-align:right;
	padding-right:2%;
}

.t_just{
	text-align: justify;
}

.indent-1{
	padding-left:1em;
	text-indent:-1em;
}

/*幅*/

.wd90c{
	width:90%;
	margin:0 auto !important;
}


/* 画像リンク処理*/
.hov a:hover img {
	opacity: .8;
	filter: alpha(opacity=80);
	 -ms-filter: "alpha(opacity=80)";
}

.article-body img,
div.side-widget img{
    margin:0;
    -webkit-filter:drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.2));
    -moz-filter:drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.2));
    -ms-filter:drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.2));
    filter:drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.2));
}


/*box*/

div.main_border_box{
	border:solid 1px var(--main_color);
    background-color: var(--box_color);
}

.sub_border_box{
	border:solid 1px var(--sub_color);
}

div.text_border_box{
	border:solid 1px var(--text_color);
}

div.widget_box{
    border:solid 2px var(--main_color);
}

.inner-box{
	padding:1rem 2% 1rem 2%;
}

.box_h{
	background-color: var(--box_color);
	color:var(--back_color);
}

.box_h a{
	color:var(--back_color) !important;
}


.d-ib{
	display:inline-block;
}

/* padding margin */
.mb8,.mb8m{
	margin-bottom:0.8rem !important;
}

.mb15{
	margin-bottom:15px !important;
}

.mb30{
	margin-bottom:30px !important;
}

.mt30{
	margin-top:30px !important;
}

.mt15{
	margin-top:15px !important;
}

.mt4{
	margin-top:4px;
}

.mt2{
	margin-top:2px;
}

.pl10p{
	padding-left:10% !important;
}

.pl2p{
	padding-left:2% !important;
}

.pa2{
	padding:2px;
}

.pa2p{
	padding:2% 8px;
}

.pa4{
	padding:4px;
}

.pa8{
	padding:0.8rem;
}

.pa10{
	padding:1.0rem;
}

.pa12{
	padding:1.2rem;
}

.pd_s_2p{
	padding:0 2%;
}

/* flex-box*/
.flex-box{
	display:flex;
	flex-wrap:wrap;
}
.flex-just_bet{
	justify-content:space-between;
}

.flex-just_arou{
	justify-content:space-around;
}

.flex-just_center{
	justify-content:center;
}

.flex_align_start{
	align-content:flex-start;
}

.flex_item_100{
	flex-basis:100%;
}

.flex_item_m100{
	flex-basis:100%;
}

.flex_item_90{
	flex-basis:90%;
}

.flex_item_80{
	flex-basis:78%;
	padding:4px 1% 2px 1%;
}

.flex_item_75{
	flex-basis:75%;
	padding:4px 1% 2px 1%;
}

.flex_item_70{
	flex-basis:70%;
}

.flex_item_66{
	flex-basis:64%;
	margin-right:2%;
}

.flex_item_60{
	flex-basis:58%;
	margin-right:2%;
}

.flex_item_50{
	flex-basis:48%;
	margin-right:2%;
}

.flex_item_40{
	flex-basis:38%;
	margin-right:2%;
}

.flex_item_35{
	flex-basis:33%;
	margin-right:2%;
}

.flex_item_33{
	flex-basis:32%;
	margin-right:1%;
}

.flex_item_33nm{
	flex-basis:33%;
}

.flex_item_30{
	flex-basis:28%;
	margin-right:2%;
}

.flex_item_25{
	flex-basis:23%;
	margin-right:2%;
}

.flex_item_20{
	flex-basis:18%;
	margin-right:2%;
}

.flex_item_15{
	flex-basis:13%;
	margin-right:2%;
}

.flex_item_10{
	flex-basis:8%;
	margin-right:2%;
}

.mw750{
	max-width:750px;
}

/* 全般*/

body.page article.article{
    border:none !important;
}

.no_disp{
	display:none;
}

div#hd,div#headlogo{
	width:980px;
	margin: 12px auto;
}

div#headlogo img{
	max-height: 60px;
	max-width:280px;
	margin-left: 0;

}

div#hd img{
	width:100%;
}

div#bd,div#btn_area_f{
	width:980px;
	margin: 6px auto;
}

h1#b_name{
	width:100%;
	height:6rem;
	padding-top: 2rem;
	text-align:center;
	background-color: var(--main_color);
	color:var(--back_color);
}

h2.sub_title{
	border-bottom: var(--sub_color) solid 2px;
	padding-left: 0.5rem;
	padding-bottom: 0.8rem;
}

div.sub_cont{
	border:var(--sub_color) solid 1px ;
	padding:1.5rem 1rem;
	text-align: left;
}

div#btn_area_f{
	margin-top: 4rem;
}

/* ボタン*/
div#btn_area_f a{
    display: block;
    width:90%;
	min-height: 6rem;
    background-color: var(--sub_color);
    margin: 1rem auto;
	padding-top: 2rem;
    text-align: center;
    font-size: 2rem;
    color: gold;
    font-weight: 600;
    border-radius: 0.3em;
	text-decoration: none;
}

divbtn_area_f a:hover{
    background-color:#fffacd ;
    color: #B73879;
    border:solid 1px #B73879;
}


/* レスポンシブ*/

@media screen and ( max-width: 768px ) {
	.container{font-size: 90%;line-height:2rem;}
}

@media screen and ( max-width: 992px ){
	div#hd{width:100%;}
	div#bd,div#btn_area,div#btn_area_f{
		width:96%;
		margin: 6px auto;
	}
}