@charset "UTF-8";
/*
theme Name: on
Author: himawari
Description: 自作テーマ
version： 1.0.0
*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Kosugi+Maru&family=M+PLUS+Rounded+1c:wght@300;400;500&display=swap');
/*リセットCSS
----------------------------------------------------------------*/

/* 要素 フォントサイズ・マージン・パディングをリセット */

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	font-weight: normal;
	vertical-align: baseline;
	background: transparent;
	font-family: 'Noto Sans JP', 'Noto Serif JP', 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', 'Meiryo', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	color: #333433;
}

/* 行の高=フォントサイズ */

body {
	line-height: 1;
}

/* 新規追加要素をブロック要素化 */

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}

/* ulのマーカー非表示 */

ol, ul {
	list-style: none;
}

/* 引用符の非表示 */

blockquote, q {
	quotes: none;
}

/* blockquote要素、q要素の前後にコンテンツ非表示 */

blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}

/* フォントサイズ　リセット フォントの縦方向 ベースライン揃え 点線削除 */

a {
	margin: 0;
	padding: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
	outline: none;
}

/* ins要素 デフォルトセット 色を変える場合はここで変更 */

ins {
	background-color: #ff9;
	color: #000;
	text-decoration: none;
}

/* mark要素 デフォルトセット 色やフォントスタイルを変える場合はここで変更 */

mark {
	background-color: #ff9;
	color: #707070;
	font-style: italic;
	font-weight: bold;
}

/* テキスト 打ち消し線 */

del {
	text-decoration: line-through;
}

/* IE　デフォルトで点線を下線表示設定　下線設定 マウスオーバー時 ヘルプカーソル表示可 */

abbr[title], dfn[title] {
	border-bottom: 1px dotted;
	cursor: help;
}

/*　隣接するセルのボーダーを重ねて表示　*/

table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* 水平罫線デフォルトリセット */

hr {
	display: block;
	height: 1px;
	border: 0;
	border-top: 1px solid #cccccc;
	margin: 1em 0;
	padding: 0;
}

/* 縦方向の揃え 中央揃え */

input, select {
	vertical-align: middle;
}

/* 画像を縦に並べた時に余白0 */

img {
	vertical-align: top;
	font-size: 0;
	line-height: 0;
}

/*box-sizingを全ブラウザに対応*/

*, *: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;
}

.clearfix:after {
	overflow: hidden;
	visibility: hidden;
	height: 0;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
}

br {
	line-height: inherit;
}

/*iOSのとき角丸グラーションになるのをリセット*/

input[type="submit"] {
	-webkit-appearance: none;
	border-radius: 0;
}

/*【共通】パーツ
----------------------------------------------------------------*/

/* リンク */

a, a * {
	-webkit-transition: opacity 0.6s ease;
	-moz-transition: opacity 0.6s ease;
	-o-transition: opacity 0.6s ease;
	transition: opacity 0.6s ease;
	text-decoration: none;
	font-size: inherit;
	font-weight: inherit;
	color: inherit;
	font-family: inherit;
	-webkit-backface-visibility: hidden;
	/* 追加 */
	backface-visibility: hidden;
	/* 追加 */
}

a:hover, a:active {
	text-decoration: none;
	opacity: 0.7;
	filter: alpha(opacity=70);
}

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

/* 表示切り替え */
.pc-display {
	display: block;
}
.sp-display {
	display: none;
}

.tb-display {
	display: none;
}

.pc-none {
	display: none;
}

@media screen and (max-width: 1023px) {
	.tb-display {
		display: block;
	}
	.pc-display {
		display: none;
	}
	.pc-none {
		display: block;
	}
}

@media screen and (max-width: 767px) {
	.tb-display {
		display: none;
	}
	.sp-display {
		display: block;
	}
	.pc-display {
		display: none;
	}
	.sp-none {
		display: none;
	}
	.pc-none {
		display: block;
	}
}

/* 配置 */

.f_left {
	float: left;
	text-align: center;
	line-height: 2;
}

.f_right {
	float: right;
	text-align: center;
	line-height: 2;
}

.leftOn {
	text-align: left;
}

.rightOn {
	text-align: right;
}

.centerOn {
	text-align: center;
}

/*基本設定
----------------------------------------------------------------*/

/* 余白 */

.section-pd-nml {
	padding: 100px 0;
}

.section-pd-last {
	padding: 70px 0 120px;
}

.section-pd-large {
	padding: 110px 0 80px;
}

.mb0 {
	margin-bottom: 0;
}

.mb10 {
	margin-bottom: 10px;
}

.mb20 {
	margin-bottom: 20px;
}

.mb30 {
	margin-bottom: 30px;
}

.mb40 {
	margin-bottom: 40px;
}

.mb50 {
	margin-bottom: 50px;
}

.mb60 {
	margin-bottom: 60px;
}

.mb60 {
	margin-bottom: 60px;
}

.mb70 {
	margin-bottom: 70px;
}

.mb80 {
	margin-bottom: 80px;
}

.mb90 {
	margin-bottom: 90px;
}

.mb100 {
	margin-bottom: 100px;
}

.mb120 {
	margin-bottom: 120px;
}

.mb140 {
	margin-bottom: 140px;
}

.mr0 {
	margin-right: 0;
}

.mr20 {
	margin-right: 20px;
}

@media screen and (max-width:767px) {
	.section-pd-nml {
		padding: 60px 0;
	}
	.section-pd-last {
		padding: 50px 0 60px;
	}
	.section-pd-large {
		padding: 80px 0 60px;
	}
	.mb30 {
		margin-bottom: 20px;
	}
	.mb40 {
		margin-bottom: 25px;
	}
	.mb50 {
		margin-bottom: 30px;
	}
	.mb60 {
		margin-bottom: 35px;
	}
	.mb70 {
		margin-bottom: 40px;
	}
	.mb80 {
		margin-bottom: 45px;
	}
	.mb90 {
		margin-bottom: 50px;
	}
	.mb100 {
		margin-bottom: 50px;
	}
	.mb120 {
		margin-bottom: 60px;
	}
	.mb140 {
		margin-bottom: 70px;
	}
}

/*  配置  */

.flex-nml {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: wrap;
}

.flex-btw {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: wrap;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

.flex-cnt {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: wrap;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.flex-end {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: wrap;
	-webkit-box-pack: end;
	-ms-flex-pack: end;
	justify-content: flex-end;
}

.flex-around {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: wrap;
	-ms-flex-pack: distribute;
	justify-content: space-around;
}

.row-reverse {
	-webkit-flex-direction: row-reverse;
	flex-direction: row-reverse;
}

.items-start {
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
}

.items-center {
	-webkit-align-items: center;
	align-items: center;
}

.items-end {
	-webkit-box-align: end;
	-ms-flex-align: end;
	align-items: flex-end;
}

.absolute-center {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
}

.y-center {
	left: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
}

.x-center {
	top: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
}

/*枠*/

.contents-inr {
	max-width: 1200px;
	margin-right: auto;
	margin-left: auto;
}

.contents-inr.small {
	max-width: 900px;
	margin: 0 auto;
}

.contents-inr.large {
	max-width: 1400px;
}

.contents-inr.full {
	max-width: 100%;
}

/*1000pxの枠*/

.inr-1000 {
	max-width: 1000px;
	margin-right: auto;
	margin-left: auto;
}

@media screen and (max-width:1230px) {
	.contents-inr {
		margin-right: 15px;
		margin-left: 15px;
	}
}

@media screen and (max-width:1030px) {
	.contents-inr.small {
		padding: 0 15px;
	}
}

@media screen and (max-width:1430px) {
	.contents-inr.large {
		margin-right: 15px;
		margin-left: 15px;
	}
}

/*テキスト*/

html {
	font-size: 62.5%;
	font-family: 'Noto Sans JP', 'Noto Serif JP', 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', 'Meiryo', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}

body {
	font-family: 'Noto Sans JP', 'Noto Serif JP', 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', 'Meiryo', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	font-size: 1.6rem;
	color: #707070;
}

p {
	line-height: 1.875;
}

h1, h2, h3, h4, h5, h6 {
	line-height: 1.66;
}

.inline-block {
	display: inline-block;
}

.inline {
	display: inline;
}

.txt-bold {
	font-weight: 600;
}

@media screen and (max-width:767px) {
	body p {
		font-size: 1.6rem;
		line-height: 1.785;
	}
}

/*SPレイアウト(カラム落ちした後中心に寄せる)*/

@media screen and (max-width:767px) {
	/*flexの親*/
	.sp-flex-cnt {
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
	}
}

/**ネイティブCSS **/

strong {
	font-weight: bold;
}

em {
	font-style: italic;
}

blockquote {
	display: block;
	-webkit-margin-before: 1em;
	-webkit-margin-after: 1em;
	-webkit-margin-start: 40px;
	-webkit-margin-end: 40px;
}

/* img */

.aligncenter {
	display: block;
	margin: 0 auto;
}

.wp-caption.alignright, .alignright {
	float: right;
	max-width: 48%;
	margin: 0 0 2% 2%;
}

.wp-caption.alignleft, .alignleft {
	float: left;
	max-width: 48%;
	margin: 0 2% 2% 0;
}

.wp-caption, img {
	height: auto;
	max-width: 100%;
}

/* clearfix */

.clearfix {
	overflow: hidden;
	zoom: 1;
}

.clearfix:after {
	content: "";
	display: block;
	clear: both;
}

footer {
	position: relative;
}

main {
	display: block;
}
iframe {
    width: 100%;
    height: 300px;
}
@media screen and (max-width:767px) {
	iframe {
     height: 200px;
	}
}


/*
右から左へ
----------------------------*/
@keyframes infinity-scroll-left {
	from {
	  transform: translateX(0);
	}
	to {
	  transform: translateX(-100%);
	}
  }
  
  /*
  IE11対策
  ----------------------------*/
  _:-ms-lang(x)::-ms-backdrop,
  .d-demo {
	display: -ms-grid;
	overflow: hidden;
  }
  /*----------------------------*/
  
  .d-demo__wrap {
	display: flex;
	overflow: hidden;
  }
  
  .d-demo__list {
	display: flex;
	list-style: none;
  }
  
  .d-demo__list--left{
  animation :infinity-scroll-left 95s infinite linear 0.5s both;
  }
  
  .d-demo__item {
	width: 300px;
  }
  .d-demo__item  img{
	 width: 100%;
	 height: 200px;
  }

  /*
左から右へ
----------------------------*/
@keyframes infinity-scroll-right {
	from {
	  transform: translateX(-100%);
	}
	to {
	  transform: translateX(0%);
	}
  }
  
  .d-demo__list--right{
  animation :infinity-scroll-right 95s infinite linear 0.5s both;
  }

  /*
IE11対策
----------------------------*/
_:-ms-lang(x)::-ms-backdrop,
.d-demo {
  display: -ms-grid;
  overflow: hidden;
}
/*----------------------------*/

.demo__wrap:hover .d-demo__list--left{
	animation-play-state: paused;
  }

  /*　フォーム　*/
.mailform p{
	font-size: 1.4rem;
	color: #c00;
	line-height: 2.14;
}
.contact-form{
	max-width: 1000px;
	margin: 0 auto;
	margin-top: 100px;
}
.contact-form .note{
	color: #d50f14;
	font-size: 1.4rem;
	text-align: right;
	margin-bottom: 10px;
}
.contact-form .tbl-cmn01{
	margin-bottom: 60px;
	border: none;
}
.contact-form .tbl-cmn01 table {
	border: none;
}
.contact-form .tbl-cmn01 tr {
	border: none;
}
.contact-form .tbl-cmn01 th  {
	background-color: #fff;
	width: 30%;
}
.contact-form .tbl-cmn01 td {
	padding: 25px 50px;
}
@media screen and (max-width: 767px){
	.contact-form .tbl-cmn01 table th {
		border-right: none;
		padding: 10px 10px 5px 10px;
		display: block;
		width: 100%;
	}
}

.contact-form .tbl-cmn01 td input[type="email"],
.contact-form .tbl-cmn01 td input[type="text"],
.contact-form .tbl-cmn01 td input[type="tel"],
.contact-form .tbl-cmn01 td textarea {
	min-height: 60px;
	vertical-align: middle;
	border: 1px solid #ccc;
	background-color: #E8E8E8;
	font-size: 1.4rem;
	font-family: 'Noto Sans JP', sans-serif;
	-webkit-appearance: none;
}
.contact-form .tbl-cmn01 td select {
	min-height: 60px;
}
.contact-form .tbl-cmn01 .field-s {
	width: 80%;
}
.contact-form .tbl-cmn01 .field-m {
	width: 80%;
}
.contact-form .tbl-cmn01 .field-l {
	width: 80%; 
}
.mwform-checkbox-field input, .mwform-radio-field input{
	margin: 0 5px 0 0;
}
.mwform-radio-field.horizontal-item{
	display: inline-block;
}
.mw_wp_form .horizontal-item + .horizontal-item {
    margin-left: 20px !important;
}
.contact-btn-box {
	text-align: center;
}
.contact-btn-box input.send-btn {
	display: inline-block;
	width: 100%;
	max-width: 400px;
	line-height: 80px;
	border-radius: 0;
	background: #8B8B8B;
	font-size: 2rem;
	color: #fff;
	cursor: pointer;
	text-align: center;
	-webkit-appearance: none;
	border: #707070 1px solid;
	padding: 0;
	margin: 30px 10px;
}
.contact-btn-box input.return-btn {
	display: inline-block;
	margin: 0 15px 0 0;
	width: 100%;
	max-width: 400px;
	line-height: 80px;
	border-radius: 0;
	background: #ccc;
	border: none;
	font-size: 2rem;
	color: #333;
	text-align: center;
	cursor: pointer;
	border: #707070 1px solid;
	-webkit-appearance: none;
	margin: 30px 10px;
}
@media screen and (max-width:767px) {
	.contact-form .tbl-cmn01{
		margin-bottom: 40px;
	}
	.contact-btn-box input.send-btn {
		line-height: 60px;
		font-size: 1.6rem;
		width: 80%;
		font-size: 1.6rem;
	}
.contact-form .tbl-cmn01 th span {
	font-size: 1.4rem;
}
.contact-form .tbl-cmn01 .field-s {
	width: 100%;
}
.contact-form .tbl-cmn01 .field-m {
	width: 100%;
}
.contact-form .tbl-cmn01 .field-l {
	width: 100%;
}

.contact-btn-box input .send-btn {
	line-height: 60px;
	font-size: 1.6rem;
	width: 80%;
}
.contact-btn-box .return-btn {
	margin: 0 0 15px 0;
	line-height: 60px;
	font-size: 1.6rem;
	width: 80%;
}
}