/*
Theme Name: SYN Ownd Child
Template: syn-ownd
Theme URI: https://syn.design/
Author: 株式会社ウェブライダー
Author URI: https://web-rider.jp/
Description: SYN Ownd の子テーマ
Version: 1.0.0
Text Domain: syn-ownd-child
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/
@charset "utf-8";

# =================================================================
# 追加css
# =================================================================
/*テキストの寄せ（左寄せ、中央寄せ、右寄せ）*/
.al-l { text-align:left; }
.al-c { text-align:center; }
.al-r { text-align:right; }

/*フロート*/
.alignleft {
  float:left;
  margin-left:0;
  margin-bottom:2rem;
}
.alignright {
  float:right;
  margin-right:0;
  margin-bottom:2rem;
}
.alignfull {
  clear:both!important;
}

/*画像のフロート*/
img.aligncenter {
  display:block;
  margin:0 auto;
}
img.alignleft {
  float:left;
  margin:0 1em 0 0;
}
img.alignright {
  float:right;
  margin:0 0 0 1em;
}

/*回り込み
※floatを解除*/
.cb{
	clear: both;
}

/*枠線*/
.border{
	border: 1px solid #ccc;
}

.border01{
	border: 5px double #ccc;
	border-radius: 5px;
	padding: 1em 1em;
	margin-bottom: 2em;
	background-color: #fff;
}

/*余白調整*/
.m0 { margin:0!important; }
.m0-t { margin-top:0!important; }
.m0-r { margin-right:0!important; }
.m0-b { margin-bottom:0!important; }
.m0-l { margin-left:0!important; }
.m10 { margin:10px!important; }
.m10-t { margin-top:10px!important; }
.m10-r { margin-right:10px!important; }
.m10-b { margin-bottom:10px!important; }
.m10-l { margin-left:10px!important; }
.m20 { margin:20px!important; }
.m20-t { margin-top:20px!important; }
.m20-r { margin-right:20px!important; }
.m20-b { margin-bottom:20px!important; }
.m20-l { margin-left:20px!important; }
.m30 { margin:30px!important; }
.m30-t { margin-top:30px!important; }
.m30-r { margin-right:30px!important; }
.m30-b { margin-bottom:30px!important; }
.m30-l { margin-left:30px!important; }
.m40-t { margin-top:40px!important; }
.m40-r { margin-right:40px!important; }
.m40-b { margin-bottom:40px!important; }
.m40-l { margin-left:40px!important; }
.m50-t { margin-top:50px!important; }
.m50-r { margin-right:50px!important; }
.m50-b { margin-bottom:50px!important; }
.m50-l { margin-left:50px!important; }
.m55-t { margin-top:55px!important; }
.m55-b { margin-bottom:55px!important; }
.m60-t { margin-top:60px!important; }
.m60-b { margin-bottom:60px!important; }
.m120-t { margin-top:120px!important; }
.m120-b { margin-bottom:120px!important; }

/*フォントサイズの設定*/
.f08em{ font-size: 0.8em; }
.f09em{ font-size: 0.9em; }
.f10em{ font-size: 1.0em; }
.f11em{ font-size: 1.1em; }
.f12em{ font-size: 1.2em; }
.f13em{ font-size: 1.3em; }
.f14em{ font-size: 1.4em; }
.f15em{ font-size: 1.5em; }
.f16em{ font-size: 1.6em; }
.f17em{ font-size: 1.7em; }
.f18em{ font-size: 1.8em; }
.f19em{ font-size: 1.9em; }
.f20em{ font-size: 2.0em; }
.f21em{ font-size: 2.1em; }
.f22em{ font-size: 2.2em; }
.f23em{ font-size: 2.3em; }
.f24em{ font-size: 2.4em; }
.f25em{ font-size: 2.5em; }
.f26em{ font-size: 2.6em; }
.f27em{ font-size: 2.7em; }
.f28em{ font-size: 2.8em; }
.f29em{ font-size: 2.9em; }
.f30em{ font-size: 3.0em; }
.f300em{ font-size: 30.0em; }

/*フォントの色設定*/
.red{ color: #e53935!important; }/*赤*/
.blue{ color: #0000dd!important; }/*青*/
.green{ color: #4caf50!important; }/*緑*/
.yellow{ color: #ffff00!important; }/*黄*/
.navy{ color: #3f51b5!important; }/*紺*/
.orange{ color: #ff9800!important; }/*橙*/
.pink{ color: #ec407a!important; }/*ピンク*/
.purple{ color: #9c27b0!important; }/*紫*/
.olive{ color: #808000!important; }/*オリーブ*/
.lime{ color: #00ff00!important; }/*黄緑*/
.aqua{ color: #00bcd4!important; }/*水色*/
.black{ color: #000!important; }/*黒*/
.gray{ color: #ccc!important; }/*灰*/
.white{ color: #fff!important; }/*白*/
.brown{ color: #6d4c33!important; }/*茶*/
.crimson{ color: #dc143c!important; }/*エンジ色*/
.saddle-brown{ color: #8b4513!important; }/*薄茶色*/

/*注記*/
.note{
	display: block;
	padding-left: 1em;
	text-indent: -1em;
}

.note2{
	display: block;
	padding-left: 2em;
	text-indent: -2em;
}

/* タイトル付きBOX */
.box01 {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #95ccff;
    border-radius: 8px;
}
.box01 span.box-title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 20px;
    padding: 0 9px 0 30px;
    line-height: 1;
    font-size: 19px;
    background: #fff;
    color: #95ccff;
    font-weight: bold;
}
.box01 span.box-title:before {
padding-right:0.5em;
font-family: 'Font Awesome 5 Free';
content: "\f0a4";
font-weight: 400;
position: absolute;
left : 0.3em; /*左端からのアイコンまで*/
color: #95ccff; /*アイコン色*/
}
.box01 p {
    margin: 0; 
    padding: 0;
}

/*文章中の間*/
.interval{
	margin: 50px auto;
	text-align: center;
}

.interval img{
	display: block;
	margin: 60px auto;
}

/*段組（賢威70）*/
.col5-wrap,
.col4-wrap,
.col3-wrap,
.col2-wrap{
	margin: 0 0 1em;
}

.col5-wrap .col,
.col5-wrap .col_2of5,
.col5-wrap .col_3of5,
.col5-wrap .col_4of5,
.col4-wrap .col,
.col4-wrap .col_2of4,
.col4-wrap .col_3of4,
.col3-wrap .col,
.col3-wrap .col_2of3,
.col2-wrap .col{
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	float: left;
	margin-left: 1.5%;
}

.col5-wrap .col:first-child,
.col5-wrap .col_2of5:first-child,
.col5-wrap .col_3of5:first-child,
.col5-wrap .col_4of5:first-child,
.col4-wrap .col:first-child,
.col4-wrap .col_2of4:first-child,
.col4-wrap .col_3of4:first-child,
.col3-wrap .col:first-child,
.col3-wrap .col_2of3:first-child,
.col2-wrap .col:first-child{
	margin-left: 0;
}

.col5-wrap .col{
	width: 18.5%;
}

.col5-wrap .col_2of5{
	width: 38.5%;
}

.col5-wrap .col_3of5{
	width: 58.5%;
}

.col5-wrap .col_4of5{
	width: 78.5%;
}

.col4-wrap .col{
	width: 23.5%;
}

.col4-wrap .col_2of4{
	width: 48.5%;
}

.col4-wrap .col_3of4{
	width: 73.5%;
}

.col3-wrap .col{
	width: 32%;
}

.col3-wrap .col_2of3{
	width: 65.5%;
}

.col2-wrap .col{
	width: 49%;
}

.col-link{
	border: 1px solid #ccc;
}

.col-link a{
	display: block;
	color: #333;
	text-decoration: none;
}

.col-link a:hover,
.col-link a:active,
.col-link a:focus{
	background: #eee;
}

/*回り込み（賢威70）
※モバイル時には回り込み解除*/
.left{
	float: left;
	margin: 0 1em 1em 0;
}

.right{
	float: right;
	margin: 0 0 1em 1em;
}

/*回り込み
※floatを解除*/
.cb{
	clear: both;
}

/*動画などのレスポンシブ対応*/
embed, iframe, object, video{
	max-width: 100%;
}

/*ボタン*/
.btn{
	display: inline-block;
	padding: 1em;
	border: 0;
	color: #4b3a24;
	text-decoration: none;
	border-radius: 8px;
}

.btn:hover,
.btn:active,
.btn:focus{
	background: #67ced6;
	cursor: pointer;
	color: #4b3a24;
}

.main-conts .btn:hover,
.main-conts .btn:active,
.main-conts .btn:focus{
	background: #74dcbd;
	cursor: pointer;
}


.btn span{
	padding-left: 18px;
	background: url(./images/icon/icon-btn-arw.png) left center no-repeat;
}

	/*Retina（高解像度）ディスプレイ用*/
	@media screen and (-webkit-min-device-pixel-ratio:2),
	(min-resolution: 2dppx){

		.btn span{
			padding-left: 18px;
			background: url(./images/icon/icon-btn-arw@2x.png) left center no-repeat;
			-webkit-background-size: 10px 14px;
			background-size: 10px 14px;
		}

	}

.btn-green{
	padding: 15px 40px;
	background: #a0de83;
	font-size: 1.25em;
	box-shadow: 4px 4px 0px #ebf4dd;
}

.btn-green:hover,
.btn-green:active,
.btn-green:focus{
	background: #ebf4dd !important;
	box-shadow: 4px 4px 0px #ebf4dd;
	cursor: pointer;
}

.btn-blue{
	padding: 15px 40px;
	background: #84ded6;
	font-size: 1.25em;
	box-shadow: 4px 4px 0px #ddf4eb;
}

.btn-blue:hover,
.btn-blue:active,
.btn-blue:focus{
	background: #ddf4eb !important;
	box-shadow: 4px 4px 0px #ddf4eb;
	cursor: pointer;
}

.btn-orange{
	padding: 15px 40px;
	background: #dec683;
	font-size: 1.25em;
	box-shadow: 4px 4px 0px #f4e7dd;
}

.btn-orange:hover,
.btn-orange:active,
.btn-orange:focus{
	background: #f4e7dd !important;
	box-shadow: 4px 4px 0px #f4e7dd;
	cursor: pointer;
}

.btn-red{
	padding: 15px 40px;
	background: #de9e83;
	font-size: 1.25em;
	box-shadow: 4px 4px 0px #f4dddd;
}

.btn-red:hover,
.btn-red:active,
.btn-red:focus{
	background: #f4dddd !important;
	box-shadow: 4px 4px 0px #f4dddd;
	cursor: pointer;
}

.btn-green span,
.btn-blue span,
.btn-orange span,
.btn-red span{
	padding-left: 20px;
	background: url(./images/icon/icon-btn-arw01.png) left center no-repeat;
}

	/*Retina（高解像度）ディスプレイ用*/
	@media screen and (-webkit-min-device-pixel-ratio:2),
	(min-resolution: 2dppx){

		.btn-green span,
		.btn-blue span,
		.btn-orange span,
		.btn-red span{
			background: url(./images/icon/icon-btn-arw01@2x.png) left center no-repeat;
			-webkit-background-size: 10px 14px;
			background-size: 10px 14px;
		}

	}

.btn-form01{
	padding: 25px 50px;
	background: #67ced6;
	font-size: 1.25em;
}

.btn-form01 span{
	color: #fff;
	padding-left: 20px;
	background: url(./images/icon/icon-btn-arw01.png) left center no-repeat;
}

	/*Retina（高解像度）ディスプレイ用*/
	@media screen and (-webkit-min-device-pixel-ratio:2),
	(min-resolution: 2dppx){

		.btn-form01 span{
			background: url(./images/icon/icon-btn-arw01@2x.png) left center no-repeat;
			-webkit-background-size: 10px 14px;
			background-size: 10px 14px;
		}

	}

.btn-form02{
	padding: 20px 30px;
	background: #a8e6d1;
	font-size: 1.125em;
	color: #fff;
}

.btn-form02 span{
	color: #fff;
	padding-left: 18px;
	background: url(./images/icon/icon-btn-arw02.png) left center no-repeat;
}

	/*Retina（高解像度）ディスプレイ用*/
	@media screen and (-webkit-min-device-pixel-ratio:2),
	(min-resolution: 2dppx){

		.btn-mail span{
			background: url(./images/icon/icon-btn-arw02@2x.png) left center no-repeat;
			-webkit-background-size: 10px 14px;
			background-size: 10px 14px;
		}

	}

.btn-mail{
	padding: 12px 32px;
	background: #ceeaff;
	box-shadow: 4px 4px 0px #67ced6;
}

.fl-c .btn-mail{
	height: 34px;
	background: #74dcbd;
	box-shadow: 4px 4px 0px #a8e6d1;
}

.fl-c .btn-mail:hover{
	background: #a8e6d1;
}

.btn-mail span{
	padding-left: 30px;
	background: url(./images/icon/icon-btn-book.png) left center no-repeat;
}

.fl-c .btn-mail span {
	color: #ffffff;
	background: url(./images/icon/icon-btn-mail-s.png) left center no-repeat;
}

.contact-btn .btn-mail span {
	background: url(./images/icon/icon-btn-contact.png) left center no-repeat;
}

	/*Retina（高解像度）ディスプレイ用*/
	@media screen and (-webkit-min-device-pixel-ratio:2),
	(min-resolution: 2dppx){

		.btn-mail span{
			background: url(./images/icon/icon-btn-book@2x.png) left center no-repeat;
			-webkit-background-size: 24px 23px;
			background-size: 24px 23px;
		}

		.fl-c .btn-mail span {
			color: #ffffff;
			background: url(./images/icon/icon-btn-mail-s@2x.png) left center no-repeat;
			-webkit-background-size: 18px 14px;
			background-size: 18px 14px;
		}

	}

.btn-detail{
	color: #ffffff;
	background: #74dcbd;
}

.btn-detail:hover{
	background: #a8e6d1 !important;
}

.btn-detail span{
	padding-left: 20px;
	background: url(./images/icon/icon-btn-arw01.png) left center no-repeat;
}

	/*Retina（高解像度）ディスプレイ用*/
	@media screen and (-webkit-min-device-pixel-ratio:2),
	(min-resolution: 2dppx){

		.btn-detail span{
			background: url(./images/icon/icon-btn-arw01@2x.png) left center no-repeat;
			-webkit-background-size: 10px 14px;
			background-size: 10px 14px;
		}

	}

/*ページ送り*/
.link-next{
	text-align: right;
}

.blog .article-body .link-next,
.archive .article-body .link-next,
.search .article-body .link-next{
	margin-bottom: 0;
}

.link-next a{
	padding-left: 13px;
	background: url(./images/icon/icon-arw-next.png) left 6px no-repeat;
}

.link-back a{
	padding-left: 13px;
	background: url(./images/icon/icon-arw-prev.png) left 6px no-repeat;
}

	/*Retina（高解像度）ディスプレイ用*/
	@media screen and (-webkit-min-device-pixel-ratio:2),
	(min-resolution: 2dppx){

		.link-next a{
			background: url(./images/icon/icon-arw-next@2x.png) left 6px no-repeat;
			-webkit-background-size: 7px 10px;
			background-size: 7px 10px;
		}

		.link-back a{
			background: url(./images/icon/icon-arw-prev@2x.png) left 6px no-repeat;
			-webkit-background-size: 7px 10px;
			background-size: 7px 10px;
		}

	}

.page-nav ol{
	margin-left: 0;
	text-align: center;
}

.page-nav li{
	display: inline-block;
	margin-right: 10px;
	padding: 4px 8px;
	border: 1px solid #67ced6;
}

.page-nav li:last-child{
	margin-right: 0;
}

.page-nav li a{
	display: block;
	margin: -4px -8px;
	padding: 4px 8px;
	color: #4b3a24;
	text-decoration: none;
}

.current,
.page-nav li a:hover,
.page-nav li a:active,
.page-nav li a:focus{
	background: #ceeaff;
	color: #4b3a24;
}

.page-nav-bf ul{
	margin-left: 0;
}

.page-nav-bf li{
	list-style: none;
}

.page-nav-next{
	float: right;
	padding-right: 13px;
	background: url(./images/icon/icon-arw-next.png) right center no-repeat;
}

.page-nav-prev{
	float: left;
	padding-left: 13px;
	background: url(./images/icon/icon-arw-prev.png) left center no-repeat;
}

	/*Retina（高解像度）ディスプレイ用*/
	@media screen and (-webkit-min-device-pixel-ratio:2),
	(min-resolution: 2dppx){

		.page-nav-next{
			background: url(./images/icon/icon-arw-next@2x.png) right center no-repeat;
			-webkit-background-size: 7px 10px;
			background-size: 7px 10px;
		}

		.page-nav-prev{
			background: url(./images/icon/icon-arw-prev@2x.png) left center no-repeat;
			-webkit-background-size: 7px 10px;
			background-size: 7px 10px;
		}

	}