@charset "UTF-8";


/*----------------------------------------------------
  Reset
----------------------------------------*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
	margin: 0;
	padding: 0;
	-webkit-text-size-adjust: 100%; /* ブラウザ側での自動調整をなしにする */
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
li{
	list-style:none;
}

.bg-gray {
	background-image:url(../img/bg01.jpg);
}
.bg-deepgreen {
	background-color:#5c8091;
}
.bg-pink {
	background-color:#fff2f2;
}

/* --------  680〜　PC調整   --------*/
@media screen and ( min-width:680px) {
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
	font-size:15px; /* 基準のフォントサイズを15pxとする */
}
div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td,header,footer {
	min-height: 0%;
}
.w-box {
	max-width:1160px;
	box-sizing:border-box;
	margin:0 auto;
}
.w1000-box {
	max-width:1000px;
	margin:0 auto;
}
.w1100-box {
	max-width:1100px;
	box-sizing:border-box;
	margin:0 auto;
}
}
/* --------  〜679　スマホ調整   --------*/
@media screen and ( max-width:679px) {
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
	font-size:14px; /* 基準のフォントサイズを15pxとする */
}
div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td,header,footer {
	min-height: 0%;
}
}

/*----------------------------------------------------
 sec-title
----------------------------------------*/
/* --------  680〜　PC調整   --------*/
@media screen and ( min-width:680px) {
h3.sec-title {
	width:50%;
	max-width:210px;
	margin:20px auto 40px;
}
}
/* --------  〜680　スマホ調整   --------*/
@media screen and ( max-width:679px) {
h3.sec-title {
	width:190px;
	margin:0px auto 20px;
}
}
/* --------  〜680　スマホ調整   --------*/
@media screen and ( max-width:374px) {
h3.sec-title {
	width:160px;
	margin:0px auto 20px;
}
}


/*----------------------------------------------------
 Clear Float
----------------------------------------*/
.clear {	clear:both;}
.clearfix {	zoom:1;}
.clearfix:after { 
    content:".";
    display:block;
    height:0;
    clear:both;
    visibility:hidden;
	line-height:0;
}
p,td{
	line-height:1.8;
}
/*----------------------------------------------------
 Float
----------------------------------------*/
.left {
	float:left;
}
.right {
	float:right;
}

/*----------------------------------------------------
 Alpha
----------------------------------------*/
a:hover img.alpha {
	filter:Alpha(opacity=80);
	-moz-opacity:0.8;
	opacity:0.8;
}
/*----------------------------------------------------
 img
----------------------------------------*/
body img{
	width:100%;
	vertical-align: bottom!important;
}
/*----------------------------------------------------
 a
----------------------------------------*/
a,
a img{
	text-decoration:none!important;
	outline:none!important;
	color:#000;
}

/* --------  680〜　PC調整   --------*/
@media screen and ( min-width:680px) {
a,
a img{
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
a:hover{
	text-decoration:none;
}
}

/*----------------------------------------------------
 PC＆スマホ
----------------------------------------*/
/* --------  680〜　PC調整   --------*/
@media screen and ( min-width:680px) {
.sp{
	display:none!important;
}
.pc{
	display:block;
}
.sp480{
	display:none!important;
}
}
/* --------  〜680　スマホ調整   --------*/
@media screen and ( max-width:679px) {
.sp{
	display:block;
}
.pc{
	display:none;
}
.sp480{
	display:none;
}
}
/* --------  〜680　スマホ調整   --------*/
@media screen and ( max-width:374px) {
.sp{
	display:block;
}
.pc{
	display:none;
}
.sp480{
	display:block;
}
}


/*----------------------------------------------------
   サムネイル基本設定
----------------------------------------------------*/
.thumbnail li a {
	display:block;
    overflow: hidden;
    position: relative;
}
.thumbnail li a img {
	/*画像のセンタリング（中央寄せ）*/
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}
/*----------------------------------------------------
   サムネイル各枠組みの幅設定
----------------------------------------------------*/
.thumbnail01 li {
	width:23%;
	margin:0 1%;
	float:left;
}
.thumbnail02 li {
	width:23%;
	margin:0 1%;
	float:left;
}




/*----------------------------------------------------
   ヘッダー
----------------------------------------------------*/
#topHeader,
#pageHeader {
	position:relative;
}
#topHeader .header-inner {
	background-color:rgba(255,255,255,0.8);
	/*background-color:#faf8f8;*/
}
#topHeader .headerBox {
	width:100%;
	box-sizing:border-box;
	/*background-color:#faf8f8;*/
	padding:0px ;
}

/* --------  680〜　PC調整   --------*/
@media screen and ( min-width:680px) {
#topHeader {
}
#topHeader .headerBox {
	text-align:left;
}
/*　ヘッダー左部分　*/
.headerBox .header-left-box {
	width:75%;
	float:left;
}
/*　ロゴ　*/
.headerBox .header-left-box h1 {
	width:250px;
}
.headerBox .header-left-box h1 a {
	display:block;
	padding:10px 15px;
	font-size:20px;
}
/*　ヘッダー右上部分　*/
.headerBox .header-right-box {
	width:25%;
	box-sizing:border-box;
	padding:10px;
	float:right;
}
.headerBox .header-right-box p {
	text-align:right;
}

}

/* --------  680〜　スマホ調整   --------*/
@media screen and ( max-width:679px) {
#topHeader .headerBox {
	height:60px;
	background-color:#000;
	position:fixed;
	left:0;
	top:0;
	z-index:9989;
}
/*　ロゴ　*/
.headerBox h2 {
	height: 60px;
}
.headerBox h2 a {
	/*display:block;*/
	display:inline-block;
	height: 60px;
	box-sizing:border-box;
	padding-top:10px;
	padding-bottom:10px;
	padding-left:5px;
}
.headerBox h2 a img {
	width:auto;
	height:100%;
}
}


/* --------  680〜999　テキストサイズ調整   --------*/
@media screen and (min-width:680px) and ( max-width:1119px) {
.headerBox .header-left-box {
	width:70%;
}
.headerBox .header-right-box {
	width:30%;
}
}

/* --------  680〜999　テキストサイズ調整   --------*/
@media screen and (min-width:680px) and ( max-width:999px) {
.headerBox .header-btn-top li.btn-company a,
.headerBox .header-right-box p {
	font-size:1.5vw;
}

}


/*----------------------------------------------------
  電話問い合わせ
----------------------------------------*/


/* --------  680〜　PC調整   --------*/
@media screen and ( min-width:680px) {
.tel-contact {
	width:165px;
	position:absolute;
	top:3%;
	right:3%;
}
}

/* --------  680〜　スマホ調整   --------*/
@media screen and ( max-width:679px) {
.tel-contact {
	width:30%;
	max-width:150px;
	position:absolute;
	top:0%;
	right:1%;
}
.sub .tel-contact {
	display:none;
}
}

/*----------------------------------------------------
   sec
----------------------------------------------------*/

/* --------  680〜　PC調整   --------*/
@media screen and ( min-width:680px) {
.sec {
	padding:50px 20px 70px;
}

/*　ボード　*/
.bg-board {
	margin:0 auto;
	position:relative;
	z-index:1;
	padding:40px 40px;
}
.bg-board::before,
.bg-board::after {
    content: "";
    position: absolute;
}
.bg-board::before {
    left: 0;
    top: 0;
    z-index: -1;
	box-sizing:border-box;
	background-image:url(../img/circle.png),url(../img/circle.png),url(../img/circle.png),url(../img/circle.png);
	background-repeat:no-repeat;
	background-size:15px 15px;
	background-position:left 8px top 8px, left 8px bottom 8px, right 8px top 8px, right 8px bottom 8px;
	background-color:#FFF;
	border:solid 1px #000;
    width: 100%;
    height: 100%;
}
.bg-board::after {
    top: 7px;
    left: 7px;
    z-index: -2;
	background-image:url(../img/bg02.jpg);
    width: 100%;
    height: 100%;
}


/*　カレンダー　*/
.bg-calendar {
	margin:0 auto;
	position:relative;
	z-index:1;
	padding:40px 40px;
}
.bg-calendar .calendar-ring-left {
	width:30%;
	max-width:260px;
	position:absolute;
	left:4%;
	top:-6%;
}
.bg-calendar .calendar-ring-right {
	width:30%;
	max-width:260px;
	position:absolute;
	right:4%;
	top:-6%;
}
.bg-calendar::before,
.bg-calendar::after {
    content: "";
    position: absolute;
}
.bg-calendar::before {
    left: 0;
    top: 0;
    z-index: -1;
	box-sizing:border-box;
	background-color:#FFF;
	border:solid 1px #000;
    width: 100%;
    height: 100%;
}
.bg-calendar::after {
    top: 7px;
    left: 7px;
    z-index: -2;
	background-image:url(../img/bg02.jpg);
    width: 100%;
    height: 100%;
}



/*　ノート　*/
.bg-note-inner {
	position:relative;
	padding:20px 30px;
	border:solid 1px #666;
	background-color:#FFF;
}
.bg-note-inner:before {
	content:"";
	width:150px;
	height:35px;
	border:solid 2px #000;
	background-color:#FFF;
	position: absolute;
	top: -22px;
	left: 50%;
	-webkit-transform: translate(-50%, 0);
	-ms-transform: translate(-50%, 0);
	transform: translate(-50%, 0);
}
/*.bg-note:before {
	content:"";
	width:94%;
	height:35px;
	background-image:url(../img/calendar_ring_pc.png);
	background-size:auto 100%;
	background-repeat:repeat-x;
	background-position:left top;
	position:absolute;
	left:3%;
	top:-13px;
	z-index:250;
}*/
.bg-note {
	margin:0 auto;
	position:relative;
	z-index:1;
	padding:20px 20px;
	border-radius:20px;
	background-color:#5c8091;
}
.bg-note::before,
.bg-note::after {
    content: "";
    position: absolute;
	border-radius:20px;
}
.bg-note::before {
    left: 0;
    top: 0;
    z-index: -1;
	box-sizing:border-box;
	background-color:#FFF;
	border:solid 2px #000;
    width: 100%;
    height: 100%;
	background-color:#5c8091;
}
.bg-note::after {
    top: 7px;
    left: 7px;
    z-index: -2;
	background-image:url(../img/bg02.jpg);
    width: 100%;
    height: 100%;
}


}
/* --------  680〜　スマホ調整   --------*/
@media screen and ( max-width:679px) {
.sec {
	padding:40px 2%;
}



/*　ボード　*/
.bg-board {
	margin:0 auto;
	position:relative;
	z-index:1;
	padding:40px 40px;
}
.bg-board::before,
.bg-board::after {
    content: "";
    position: absolute;
}
.bg-board::before {
    left: 0;
    top: 0;
    z-index: -1;
	box-sizing:border-box;
	background-image:url(../img/circle.png),url(../img/circle.png),url(../img/circle.png),url(../img/circle.png);
	background-repeat:no-repeat;
	background-size:15px 15px;
	background-position:left 8px top 8px, left 8px bottom 8px, right 8px top 8px, right 8px bottom 8px;
	background-color:#FFF;
	border:solid 1px #000;
    width: 100%;
    height: 100%;
}
.bg-board::after {
    top: 7px;
    left: 1%;
    z-index: -2;
	background-image:url(../img/bg02.jpg);
    width: 100%;
    height: 100%;
}



/*　カレンダー　*/
.bg-calendar {
	margin:0 auto;
	position:relative;
	z-index:1;
	padding:50px 3% 30px;
}
.bg-calendar .calendar-ring-left {
	width:20%;
	position:absolute;
	left:4%;
	top:-2.2%;
}
.bg-calendar .calendar-ring-right {
	width:20%;
	position:absolute;
	right:4%;
	top:-2.2%;
}
.bg-calendar::before,
.bg-calendar::after {
    content: "";
    position: absolute;
}
.bg-calendar::before {
    left: 0;
    top: 0;
    z-index: -1;
	box-sizing:border-box;
	background-color:#FFF;
	border:solid 1px #000;
    width: 100%;
    height: 100%;
}
.bg-calendar::after {
    top: 7px;
    left: 1%;
    z-index: -2;
	background-image:url(../img/bg02.jpg);
    width: 100%;
    height: 100%;
}



/*　ノート　*/
.bg-note-inner {
	position:relative;
	padding:20px 3%;
	border:solid 1px #666;
	background-color:#FFF;
}
.bg-note-inner:before {
	content:"";
	width:100px;
	height:30px;
	border:solid 2px #000;
	background-color:#FFF;
	position: absolute;
	top: -22px;
	left: 50%;
	-webkit-transform: translate(-50%, 0);
	-ms-transform: translate(-50%, 0);
	transform: translate(-50%, 0);
}
.bg-note {
	margin:0 auto;
	position:relative;
	z-index:1;
	padding:20px 2.5%;
	border-radius:15px;
	background-color:#5c8091;
}
.bg-note::before,
.bg-note::after {
    content: "";
    position: absolute;
	border-radius:15px;
}
.bg-note::before {
    left: 0;
    top: 0;
    z-index: -1;
	box-sizing:border-box;
	background-color:#5c8091;
	border:solid 2px #000;
    width: 100%;
    height: 100%;
}
.bg-note::after {
    top: 7px;
    left: 1%;
    z-index: -2;
	background-image:url(../img/bg02.jpg);
    width: 100%;
    height: 100%;
}
}

/* --------  〜680　スマホ調整   --------*/
@media screen and ( max-width:374px) {
/*　ボード　*/
.bg-board {
	margin:0 auto;
	position:relative;
	z-index:1;
	padding:40px 20px 30px;
}
}

/*----------------------------------------------------
   footer
----------------------------------------------------*/

/* --------  680〜　PC調整   --------*/
@media screen and ( min-width:680px) {
footer .sec-footer {
	padding:20px ;
}
footer h2 {
	width:16%;
	display:table-cell;
	vertical-align:middle;
}
footer .footer-nav {
	width:84%;
	display:table-cell;
	vertical-align:middle;
	letter-spacing:-.4em;
	box-sizing:border-box;
	padding-left:10%;
}
footer .footer-nav li {
	display:inline-block;
	vertical-align:middle;
	letter-spacing:normal;
}
footer .footer-nav li a {
	display:block;
	font-size:13px;
}
footer .footer-nav li a {
	-webkit-transform: scale(1);
	transform: scale(1);
}
footer .footer-nav li a:hover {
	color:#477083;
	-webkit-transform: scale(1.05);
	transform: scale(1.05);
	/*background-color:#fddea5;*/
}


footer .footer-nav .f-nav01,
footer .footer-nav .f-nav02 {
	width:15%;
}
footer .footer-nav .f-nav03 {
	width:18%;
}
footer .footer-nav .f-nav04 {
	width:24%;
}
footer .footer-nav .f-nav05,
footer .footer-nav .f-nav06 {
	width:12%;
}
footer .footer-nav .f-nav07 {
	width:4%;
}
footer .copy {
	padding:20px 0 10px;
	border-top:solid 1px #000;
	text-align:center;
}
}

/* --------  680〜　スマホ調整   --------*/
@media screen and ( max-width:679px) {
footer .sec-footer {
	padding:20px 0;
}
footer h2 {
	width:30%;
	margin:0 auto;
}
footer .copy {
	padding:10px 0 10px;
	border-top:solid 1px #000;
	text-align:center;
	font-family:"Times New Roman", Times, serif;
}
}

/* --------  680〜999　テキストサイズ調整   --------*/
@media screen and (min-width:680px) and ( max-width:999px) {
footer .footer-nav li a {
	font-size:1.3vw;
}
}