@charset "utf-8";
/* CSS Document */

body,td,th {
	font-family: 'Hiragino Kaku Gothic Pro',"メイリオ",Meiryo,arial,"ヒラギノ角ゴ Pro W3",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
	color: #313131;
	font-size:15px;
	line-height: 1.6;
	margin: 0;
	background-color: #FFFFFF;
}

.base_color, .mean-container .mean-bar, h3.front_h3, h3.side_h3, .item_button, .item_button2, .footer_area, #page_top {
	background-color: #ff9932;
}





.baseTXT_color, h4::before {
	color: #00736d;
}
.baseTXT_color2, .bloglist_date, .sidelist_date, .side_catlist li:before, .subP_date {
	color: #81b7b4;
}


a:link { color: #313131;text-decoration: none;}
a:visited { color: #313131;text-decoration:  none;}
a:hover {color: #00736d; text-decoration: underline;}
a:active { color: #313131;text-decoration: none;}

.navi-ul a:link { color: #ffffff;text-decoration: none;}
.navi-ul a:visited { color: #ffffff;text-decoration:  none;}
.navi-ul a:hover { color:#CFCFCF;text-decoration: underline;}
.navi-ul a:active { color: #ffffff;text-decoration: none;}

.container2 .subP_article a {color: #00736d;text-decoration: none;}
.container2 .subP_article a:hover {color: #81b7b4; text-decoration: underline;}

.subP_article .subP_date a {color: #81b7b4; text-decoration: none;}
.subP_article .subP_date a:hover {color: #00736d;text-decoration: underline;}

section {padding-bottom: 25px;}

img {
	vertical-align: bottom;
	max-width: 100%;
	height: auto;
}

.clear_both {clear: both}

.box-sizing {
	-webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box; 
}

#page_top{
	width: 50px;
    height: 50px;
    position: fixed;
    right: 20px;
    bottom: 30px;
    opacity: 0.9;
    border-radius: 50%;
}
#page_top a{
    position: relative;
    display: block;
    width: 50px;
    height: 20px;
    text-decoration: none;
}
#page_top a::before{
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: '\f106';
    font-size: 35px;
    color: #fff;
    position: absolute;
    width: 25px;
    height: 25px;
    top: -5px;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    text-align: center;
}

/* Mobile Layout: 480px and below. ------------------------------------*/

.gridContainer {
	margin-left: auto;
	margin-right: auto;
	width: 96%;
	padding-left: 2%;
	padding-right: 2%;
	clear: none;
	float: none;
	overflow : hidden ;
	box-sizing: border-box;
	  -webkit-box-sizing: border-box;
	  -moz-box-sizing: border-box;
	  -ms-box-sizing: border-box;
	  -o-box-sizing: border-box;
}

h1 {
	border-bottom: dotted 2px #939393;
	margin: 0 0 25px;
	padding: 4px 15px 6px;
	font-weight: bold;
	font-size: 23px;
	word-break: break-all;
	border-left: solid 8px #00736d;
}
h2 {
	margin: 35px 0 25px;
	padding: 10px 10px 8px 0;
	font-weight: bold;
	font-size: 21px;
	border-top: solid 3px #81b7b4;
	border-bottom:  solid 3px #81b7b4;
}
h3 {
	background-color: #ededed;
	font-weight: bold;
	padding: 8px 10px;
	margin: 35px 0 20px;
	font-size: 18px;
	border-left: solid 5px #00736d;
}

h3.front_h3, h3.side_h3 {
	border-left: none;
	color: #FFFFFF;
	margin: 0 0 20px;
	padding: 10px 15px 8px 15px;
	font-weight: normal;
	border-bottom: none!important;
	font-size: 18px;
	
}
h4 {
	font-size: 16px;
	margin-top: 25px;
}

h4::before {
    content: "\f0c8";
    margin-right: 7px;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
}


/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */

@media only screen and (min-width: 481px) {

.gridContainer {
	width: 96%;
	padding-left: 2%;
	padding-right: 2%;
	clear: none;
	float: none;
	margin-left: auto;
}
	
h1 {
	padding: 6px 15px 8px;
	font-size: 27px;
}
h2 {font-size: 23px;}
h3 {
	padding: 10px;
	font-size: 20px;
}
h3.front_h3, h3.side_h3 {padding: 12px 20px;}
h4 {font-size: 17px}


}

/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 769px) {

.gridContainer {
	width: 1035px;
	padding-left: 0;
	padding-right: 0;
	margin: auto;
	clear: none;
	float: none;
	margin-left: auto;
}
	
h1 {font-size: 28px;}
h2 {padding: 12px 10px 10px 0;}
h3 {padding: 12px 13px 10px;}
h3.front_h3, h3.side_h3 {font-size: 18px;}


}