@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Hind:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500&display=swap');


body {
	font-family: Helvetica, '游ゴシック', 'Yu Gothic', YuGothic, HiraKakuProN-W3, 'メイリオ', Meiryo, sans-serif;
	font-size: 14px;
	line-height:1.9;
	font-weight: 300;
	color: #000;
	background: #fff;
	-webkit-text-size-adjust:100%;
}


/* --------------------- COMMON --------------------- */
a {
	color: #2b86b5;
	text-decoration: none;
}
a:hover, .active {
  text-decoration: underline;
}
a:active, a:focus,input:active, input:focus{
	outline: none;
}

h1, h2, h3 {
	font-family: 'Noto Sans JP', serif;
	font-weight: 500;
}
h1 { font-size: 22px;}
h2 { font-size: 20px;}
h3 { font-size: 18px;}

img {
	max-width: 100%;
	height: auto;
  border: 0;
  margin: 0;
}

.inner {
	width: 80%;
	margin: 0 auto;
	padding-bottom: 50px;
}

.innerS {
	width: 60%;
	margin: 0 auto;
	padding-bottom: 50px;
}

.col3 a {
	display: block;
	color: #000;
}

.col3 a:hover {
	color: #0032CB;
	text-decoration: none;
}

.mb5 {margin-bottom: 5px;}
.mb10 {margin-bottom: 10px;}
.mb20 {margin-bottom: 20px;}
.mt5 {margin-top: 5px;}
.mt10 {margin-top: 10px;}
.mt20 {margin-top: 20px;}

.caution {color: #c00;}

.pc { display: block !important;}
.sp { display: none !important;}

.button_01 {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 350px;
  height: 55px;
  background: #2b86b5;
  color: #fff;
  font-weight: bold;
}
.button_01:hover {
	color: #000;
  background: #eee;
  border: 1px solid #2b86b5;
	text-decoration: none;
}

/* --------------------- HEADER --------------------- */
#header {
	text-align: center;
}

#logo {
	padding: 25px 0 15px;
}
#logo img{
  transform: scale(.8);
}

#mainnav {
	display: block;
	font-family: 'Noto Sans JP', serif;
}

.menu li a {
	color: #000;
	font-family: 'Noto Sans JP', serif;
}

.headerTxt {
	display: block;
	padding: 5px 0 15px;
	font-size: 12px;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 400;
}

/* --------------------- TOP MAIN --------------------- */
#mainImg {
	position:relative;
	text-align:center;
	margin-bottom: 80px;
}
#mainImg img {
	width: 100%;
	height: auto;
}
#maintxt {
	position: absolute;
	top: 50%;
	-webkit-transform: translate(0, -50%);
	transform: translate(0, -50%);
	width: 100%;
	color: #000;
	line-height: 1.2;
	text-align: center;
}
#maintxt h1 {
	font-size: 40px;
	font-family: 'Hind', sans-serif;
	margin-bottom: 5px;
	font-weight: 400;
}



/* --------------------- CONTENTS --------------------- */
#contents {
	text-align:center;
	margin: 0 auto;
}

#column p {
	margin-bottom: 5px;
}

.topBanner {
	width: 60%;
	margin: 0 auto 60px;
}
.topBanner img {
	width: 100%;
}

.topStitle {
	width: 60%;
	margin: 0 auto;
	background: url("../images/borderBlack.png") repeat-x 0 50%;
	background-size: 1px 1px;
}
.topStitle h1 {
	margin-bottom: 30px;
	padding: 10px;
	text-align: center;
}
.topStitle h1 span {
	display: inline-block;
	background: #fff;
	padding: 0 80px;
}

/*.stitle h1 {
	margin-bottom: 30px;
	padding: 10px;
	font-size: 120%;
	font-weight: 500;
	text-align: center;
}
.stitle h1 span {
	display: inline-block;
	background: #fff;
	padding: 0 80px;
}*/

.caption {
	width: 60%;
	margin: 0 auto;
	text-align: center;
}
.caption span {
	font-size: 20px;
	font-family: 'Noto Sans JP', serif;
	font-weight: 400;
	margin-bottom: 5px;
}

.stext p {
	margin-bottom: 30px;
	text-align: left;
}
.stext p.tright{
	margin-bottom: 30px;
	text-align: right;
}

.sImg {
	margin: 0 auto 30px;
	width: 65%;
	height: auto;
	text-align: center;
}

.col3 .thumb {
	text-align: center;
	margin-bottom: 15px;
}

.col3 .thumb img {
	width: 100%;
	height: auto;
}

.col3 h3 {
	margin: 20px 0 15px;
	line-height: 1.5;
}

.date {
	margin-top: 10px;
	font-size: 80%;
}

dl {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  margin: 0 auto;
  text-align: center;
}
dt {
	width: 20%;
	margin-right: 5%;
	margin-bottom: 20px;
	text-align: right;
}

dd {
	width: 75%;
	margin-bottom: 15px;
	text-align: left;
}


/* ----- service ----- */
h2.service {
	font-size: 18px;
	text-align: left;
	margin-bottom: 20px;
}

ul.scol2 li {
	display: inline-block;
	width: 48%;
	margin-bottom: 50px;
	vertical-align: top;
	text-align: left;
}

/*color*/
.stit_cl-blue {
	position: relative;
	margin-top: 20px;
	padding: .3em .3em .3em 1.3em;
	text-align: left;;
}
.stit_cl-blue::after {
	position: absolute;
	content: '';
	bottom: .7em;
	left: .2em;
	width: 14px;
	height: 14px;
	background-color: #aedbed;
}

.stit_cl-purple {
	position: relative;
	margin-top: 30px;
	padding: .3em .3em .3em 1.3em;
	text-align: left;
}
.stit_cl-purple::after {
	position: absolute;
	content: '';
	bottom: .7em;
	left: .2em;
	width: 14px;
	height: 14px;
	background-color: #e2cfe5;
}

.stit_cl-pink {
	position: relative;
	margin-top: 30px;
	padding: .3em .3em .3em 1.3em;
	text-align: left;
}
.stit_cl-pink::after {
	position: absolute;
	content: '';
	bottom: .7em;
	left: .2em;
	width: 14px;
	height: 14px;
	background-color: #f7c3c7;
}

.stit_cl-green {
	position: relative;
	margin-top: 30px;
	padding: .3em .3em .3em 1.3em;
	text-align: left;
}
.stit_cl-green::after {
	position: absolute;
	content: '';
	bottom: .7em;
	left: .2em;
	width: 14px;
	height: 14px;
	background-color: #c4e1bc;
}

.stit_cl-orange {
	position: relative;
	margin-top: 30px;
	padding: .3em .3em .3em 1.3em;
	text-align: left;
}
.stit_cl-orange::after {
	position: absolute;
	content: '';
	bottom: .7em;
	left: .2em;
	width: 14px;
	height: 14px;
	background-color: #fde5bb;
}

/*○*/
.subtit {
	position: relative;
  padding: .3em .3em .3em 1.3em;
	text-align: left;
	font-weight: 600;
}
.subtit::before {
 	position: absolute;
	bottom: .4em;
  left: .2em;
  z-index: 2;
  content: '';
  width: 11px;
  height: 11px;
  border: 1px solid #666;
  border-radius: 100%;
}

.scol2 p {
	font-size: 12px;
	line-height:1.4;
	margin-bottom: 20px;
}

.scol2 p.subtxt {
	font-size: 12px;
	line-height:1.4;
	margin: 0 0 10px 20px;
}


/* ----- contact ----- */
/*tab*/
.tab-group {
  display: flex;
  justify-content: center;
}
.tab {
  flex-grow: 1;
  padding:5px;
  list-style:none;
  text-align:center;
  cursor:pointer;
  border: none;
	font-family: 'Noto Sans JP', serif;
  color: #0068b7;
}

.tab.is-active {
  background: #0068b7;
  color: #fff;
  transition: all 0.2s ease-out;
}

.t-panel-group {
  padding: 10px 20px;
  border: solid 1px #0068b7;
  /*background:#eee;*/
}
.t-panel {
  display:none;
}
.t-panel.is-show {
  display:block;
}
.t-panel h3{
	padding: 10px;
	background: #ddd;
	font-size: 14px;
}


/*form*/
table.t-form {	
  width: 100%;
	margin-bottom: 20px;
}
table.t-form th {
	padding: 10px;
	background: #eee;
	border-bottom: solid 1px #ccc;
}
table.t-form td {
	padding: 10px;
	border-bottom: solid 1px #ccc;
}

.t-form input {
	margin: 5px;
	height: 1.5em;
}

.submit {
	text-align: center;
}

/* for message */
p.msg {
	color: #dd0000;
	margin: 2em;
}
span.msg {
	color: #dd0000;
}

form textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 5px;
  font-size: 16px; }


/* --------------------- FOOTER --------------------- */
#footer{
	clear: both;
	padding: 50px 10px 50px 0;
	text-align: center;
	font-size: 90%;
}




	/* ======================== RESPONSIVE ======================== */
	@media only screen and (min-width: 800px){
		body{
			font-size:15px;
		}	
		a#menu{
			display:none;
		}
		.panel{
			display:block !important;
			padding-bottom: 30px;
		}
		#mainnav li{
			display: inline-block;
			position: relative;
			padding: 0 30px;
			font-size: 14px;
		}
		#mainnav li a{
			display: block;
		}
	  #footer{
			padding: 30px 10px 70px 0;
		}
	}/*min-width: 800px*/


	@media only screen and (min-width: 981px){
		.col3{
			width: 80%;
			margin: 0 auto;
		}

		.col3 > li{
			display: inline-block;
			width: 30%;
			padding: 0 1.5%;
			margin-bottom: 50px;
			vertical-align: top;
			text-align: left;
		}
	}/*min-width: 981px*/


	@media only screen and (max-width: 980px){
		.col3 > li{
			width: 80%;
			margin: 0 auto 50px;
		}
		.header{
			width: 80%;
			margin-bottom: 30px;
		}
		.header h1 span{
	  		padding: 0 15px;
		}
		#mainImg img{
			margin-bottom: 0;
		}
		.innerS{
			width: 80%;
			padding-bottom: 30px;
		}
		.col3 h3 {
			margin:20px 0 10px;
		}
	}/*max-width: 980px*/


	@media only screen and (max-width: 799px){

		h1 { font-size: 18px;}
		h2 { font-size: 16px;}
		h3 { font-size: 15px;}

		.pc { display: none!important;}
		.sp { display: block!important;}

		.button_01 {
		  width: 200px;
		  height: 40px;
		}
		.button_01:hover {
		}

		/* --------------------- HEADER --------------------- */
		#header{
			position: fixed;
			width: 100%;
			z-index: 400;
		}	
		#headerWrap{
			position: relative;
			width: 100%;
			height: 70px;
			background: #fff;
			border-bottom: 1px solid #ccc;
		}	
		#logo{
			padding: 10px 0 5px;
		}	
		#logo img{
			max-height: 35px;
			width: auto !important;
			transform: scale(1);
		}

		.headerTxt {
			padding: 5px;
			font-size: 8px;
		}

		.innerS{
			width: 90%;
			padding-bottom: 30px;
		}

		/* --------------------- NAV --------------------- */
		a#menu{
			display: inline-block;
			position: relative;
			width: 40px;
			height: 40px;
			margin: 5px;
			cursor: pointer;
		}

		#menuBtn{
			display: block;
			position: absolute;
			top: 50%;
			left: 50%;
			width: 18px;
			height: 2px;
			margin: -1px 0 0 -7px;
			background: #000;
			transition: .2s;
		}
		#menuBtn:before, #menuBtn:after{
			display: block;
			content: "";
			position: absolute;
			top: 50%;
			left: 0;
			width: 18px;
			height: 2px;
			background: #000;
			transition: .3s;
		}

		#menuBtn:before{
			margin-top: -7px;
		}

		#menuBtn:after{
			margin-top: 5px;
		}

		a#menu .close{
			background: transparent;
		}

		a#menu .close:before, a#menu .close:after{
			margin-top: 0;
		}

		a#menu .close:before{
			transform: rotate(-45deg);
			-webkit-transform: rotate(-45deg);
		}

		a#menu .close:after{
			transform: rotate(-135deg);
			-webkit-transform: rotate(-135deg);
		}

		.panel{
			width: 100%;
			display: none;
			overflow: hidden;
			position: relative;
			left: 0;
			top: -8px;
			z-index: 100;
		}
		#mainnav{
			position: absolute;
			top: 0;
			width: 100%;
			text-align: right;
			z-index:500;
		}
		#mainnav ul{
			background: #fff;
			text-align: left;
		}
		#mainnav ul ul li{
			padding-left: 20px;
		}

		#mainnav li a{
			position: relative;
			display:block;
			padding:15px 25px;
			border-bottom: 1px solid #ccc;
			color: #000;
			font-weight: 400;
		}
		#mainnav li a:before{
			display: block;
			content: "";
			position: absolute;
			top: 50%;
			left: 5px;
			width: 6px;
			height: 6px;
			margin: -4px 0 0 0;
			border-top: solid 2px #000;
			border-right: solid 2px #000;
			-webkit-transform: rotate(45deg);
			transform: rotate(45deg);
		}

		/* --------------------- MAIN --------------------- */
		#mainImg{
			position:relative;
			text-align:center;
			margin-bottom: 0;
			padding-top: 70px;
			z-index: -100;
		}
		#maintxt {
			padding-top: 70px;
		}
		#maintxt h1 {
			font-size: 30px;
			font-family: 'Hind', sans-serif;
			margin-bottom: 5px;
			font-weight: 400;
		}


		/* --------------------- CONTENTS --------------------- */
		#contents {
			position:relative;
			text-align:center;
			padding-top: 0;
			/*padding-top: 20px;*/
		}

		section {
			padding-top: 50px;
		}

		.topBanner {
			width: 90%;
			margin: 0 auto;
		}
		.topBanner img {
			width: 100%;
		}
		.topStitle {
			width: 90%;
		}
		.topStitle h1 {
			margin-bottom: 15px;
			padding: 10px;
		}
		.topStitle h1 span {
			padding: 0 25px;
		}

		.stitle h1 {
			margin-bottom: 10px;
			padding: 10px;
			font-weight: 500;
			text-align: center;
		}
		.stitle h1 span {
			padding: 0 25px;
		}

		.caption {
			width: 90%;
			margin-bottom: 20px;
		}
		.caption span{
			font-size: 18px;
		}

		.stext p {
			margin-bottom: 10px;
		}
		.stext p.tright{
			margin-bottom: 10px;
			text-align: right;
		}

		.sImg {
			margin: 0 auto 10px;
			width: 100%;
			height: auto;
			text-align: center;
		}

		dl {
		  display: block;
		  width: 100%;
		  margin: 0 auto;
		  text-align: center;
		}
		dt {
		  width: 100%;
		  background: #eee;
		  padding: 5px 0 5px 5px;
			margin-right:0;
			margin-bottom: 5px;
			text-align: left;
		}

		dd {
		  width: 100%;
			margin-bottom: 15px;
			text-align: left;
		}

		/* ----- service ----- */
		h2.service {
			font-size: 15px;
			line-height: 1.6;
			text-align: left;
			margin-bottom: 20px;
		}

		ul.scol2 li {
			display: block;
			width: 100%;
			margin-bottom: 50px;
			vertical-align: top;
			text-align: left;
		}

		/*color*/
		.stit_cl-blue {
			position: relative;
			padding: .3em .3em .1em 1.3em;
			text-align: left;
		}
		.stit_cl-blue::after {
			position: absolute;
			content: '';
			bottom: .5em;
			left: .2em;
			width: 14px;
			height: 14px;
			background-color: #aedbed;
		}

		.stit_cl-purple {
			position: relative;
			padding: .3em .3em .3em 1.3em;
			text-align: left;
		}
		.stit_cl-purple::after {
			position: absolute;
			content: '';
			bottom: .7em;
			left: .2em;
			width: 14px;
			height: 14px;
			background-color: #e2cfe5;
		}

		.stit_cl-pink {
			position: relative;
			padding: .3em .3em .3em 1.3em;
			text-align: left;
		}
		.stit_cl-pink::after {
			position: absolute;
			content: '';
			bottom: .7em;
			left: .2em;
			width: 14px;
			height: 14px;
			background-color: #f7c3c7;
		}

		.stit_cl-green {
			position: relative;
			padding: .3em .3em .3em 1.3em;
			text-align: left;
		}
		.stit_cl-green::after {
			position: absolute;
			content: '';
			bottom: .7em;
			left: .2em;
			width: 14px;
			height: 14px;
			background-color: #c4e1bc;
		}

		.stit_cl-orange {
			position: relative;
			padding: .3em .3em .3em 1.3em;
			text-align: left;
		}
		.stit_cl-orange::after {
			position: absolute;
			content: '';
			bottom: .7em;
			left: .2em;
			width: 14px;
			height: 14px;
			background-color: #fde5bb;
		}

		/*○*/
		.subtit {
			position: relative;
		  padding: .3em .3em .3em 1.3em;
			text-align: left;
			font-weight: 600;
		}
		.subtit::before {
		 	position: absolute;
			bottom: .6em;
		  left: .2em;
		  z-index: 2;
		  content: '';
		  width: 10px;
		  height: 10px;
		  border: 1px solid #666;
		  border-radius: 100%;
		}

		.scol2 p {
			font-size: 14px;
			line-height:1.4;
			margin-bottom: 20px;
		}

		.scol2 p.subtxt {
			font-size: 14px;
			line-height:1.4;
			margin: 0 0 10px 20px;
		}

		.tab.is-active {
		  background: #0068b7;
		  color: #fff;
		  transition: all 0.2s ease-out;
		}

		.t-panel-group {
		  padding: 10px 0;
		  border: solid 1px #0068b7;
		  /*background:#eee;*/
		}


		/*form*/
		table.t-form {
			max-width: 100%;
		}
		table.t-form th, table.t-form td {
			display:block;
			box-sizing: border-box;
		}
		table.t-form th {
			padding: 10px;
			background: #eee;
			border-bottom: solid 1px #ccc;
		}
		table.t-form td {
			padding: 10px;
			border-bottom: solid 1px #ccc;
		}

		.t-form input {
			margin: 0;
			font-size: 16pt;
			height: 2.0em;
		}

		table.t-form input[type="text"] {
		 width:100%;
		  -moz-box-sizing: border-box;
		  -webkit-box-sizing: border-box;
		  box-sizing: border-box;
		}
		form textarea {
		 width:100%;
		  -moz-box-sizing: border-box;
		  -webkit-box-sizing: border-box;
		  box-sizing: border-box;
		}

	}/*max-width: 799px*/