@charset "utf-8" ;
/* =======================================================
	CSS構成: 個別頁レイアウト( nanofeel )
	-----------------------------------------------------
	Last Modified: [ 2013/12/06 ]

	【TOC】
	01 : #slide								// index.html
	02 : #about_wrap						// index.html
	03 : #main > #about						// about.html
	04 : #main > #maintenance				// maintenance.html
	05 : #main > #comfort					// comfort.html
	06 : #main > #mechanism					// mechanism.html
	07 : #main > #introduction-example		// introduction-example.html
	08 : #main > #lineup					// lineup.html
	99 : layout.css の 上書き
======================================================= */



/*	01 : #slide												// index.html
---------------------------------------------------------------------- */
#slide {
	margin-bottom: 30px;
	height: 380px !important;
}

@media screen and (max-width: 768px) {
	#slide {
		height: auto !important;
		min-height: 290px;
	}
		#slide img {
			width: 100%;
			height: auto;
		}
}
@media screen and (max-width: 667px) {
	#slide {
		min-height: 255px;
	}
}
@media screen and (max-width: 640px) {
	#slide {
		min-height: 240px;
	}
}
@media screen and (max-width: 568px) {
	#slide {
		min-height: 180px;
	}
}
@media screen and (max-width: 414px) {
	#slide {
		min-height: 155px;
	}
}
@media screen and (max-width: 375px) {
	#slide {
		min-height: 135px;
	}
}
@media screen and (max-width: 320px) {
	#slide {
		min-height: 115px;
	}
}


/*	02 : #about_wrap										// index.html
---------------------------------------------------------------------- */
#about_wrap {
	background: #F5F7FC;
}
#about_wrap > div {
	width: 970px;
	margin: 0 auto;
	padding: 30px 0;

	clear: both;
	overflow: hidden;
}
#about_wrap > div > h3 {
	margin: 30px 0 25px;
	font-family: 'Noto Serif JP', serif;
	color: #46a5d1;
	font-size: 1.8em;
	text-align: center;
}
#about_wrap > div > h3::before,
#about_wrap > div > h3::after {
	content: "";
	display: inline-block;
	position: relative;
	margin: 0 15px;
	width: 39%;
	border-top: 1px solid #46a5d1;
	vertical-align: middle;
}
#about_wrap > div > ul {
	clear: both;
	overflow: hidden;
}
#about_wrap > div > ul li {
	background: #FFF;
	float: left;
	margin: 0 20px 20px 0;
	width: 310px;
}
#about_wrap > div > ul li:nth-child(3n) { margin-right: 0; }
#about_wrap > div > ul li:nth-last-child(1) ,
#about_wrap > div > ul li:nth-last-child(2) ,
#about_wrap > div > ul li:nth-last-child(3) { margin-bottom: 0; }
#about_wrap > div > ul li a {
	display: block;
	padding: 0 0 20px 20px;
}
#about_wrap > div > ul li a:hover {
	text-decoration: none;
}
#about_wrap > div > ul li a h3.fade, 
#about_wrap > div > ul li a h4 {
	margin-bottom: 15px;
	padding-top: 25px;
	font-family: 'Noto Serif JP', serif;
	color: #46a5d1;
	font-size: 2.2em;
	border-right: 11px solid #46a5d1;
}
	#about_wrap > div > ul li a h4 .small {
		font-size: .8em;
	}
#about_wrap > div > ul li a p {
	color: #666;
	font-size: 1.2em;
	line-height: 1.8;
	margin-bottom: 10px;
	width: 270px;
	height: 70px;
}
#about_wrap > div > ul li a p.ph {
	height: 105px;
}
#about_wrap > div > ul li a img {}

/* nano_lineup */
#about_wrap > div > .nano_lineup li {
	background: #FFF;
	float: left;
	margin: 0 20px 20px 0;
	width: 465px;
}
#about_wrap > div > .nano_lineup li:nth-child(2n) { margin-right: 0; }
#about_wrap > div > .nano_lineup li:nth-child(3) { margin-right: 20px; }
#about_wrap > div > .nano_lineup li:nth-last-child(1) ,
#about_wrap > div > .nano_lineup li:nth-last-child(2) ,
#about_wrap > div > .nano_lineup li:nth-last-child(3) ,
#about_wrap > div > .nano_lineup li:nth-last-child(4) { margin-bottom: 20px; }

#about_wrap > div > .nano_lineup li .lineup_img {
	float: right;
	padding-right: 20px;
	margin-top: -75px;
}

#about_wrap > div > .nano_lineup li a p {
	width: 200px;
	height: auto;
	float: left;
}

@media screen and (max-width: 768px) {
	#about_wrap > div > h3 {
		margin-top: 20px !important;
	}
	#about_wrap > div > h3::before,
	#about_wrap > div > h3::after {
		width: 15%;
	}
	#about_wrap > div > ul {
		margin: 0 15px;
	}
	#about_wrap > div > ul li {
		float: none;
		margin: 0 0 20px 0;
		width: 100%;
	}
	#about_wrap > div > .nano_lineup li {
		float: none;
		margin: 0 0 20px 0;
		width: 100%;
	}
	#about_wrap > div > ul li:nth-last-child(1) ,
	#about_wrap > div > ul li:nth-last-child(2) ,
	#about_wrap > div > ul li:nth-last-child(3) { margin-bottom: 15px; }
	#about_wrap > div > ul li a {
		padding: 0 0 20px 0;
	}
	#about_wrap > div > ul li a h3.fade, 
	#about_wrap > div > ul li a h4 {
		position: relative;
		margin-bottom: 10px;
		padding: 15px 0 0 15px;
		border-right: none;
	}
	#about_wrap > div > ul li a h3.fade::before, 
	#about_wrap > div > ul li a h4::before {
		position: absolute;
		content: " ";
		display: block;
		border-top: 5px solid #46a5d1;
		top: 0;
		left: 0;
		width: 30%;
	}
	#about_wrap > div > ul li a .item_cover {
		margin: 0 15px;
	}
	#about_wrap > div > ul li a p {
		margin: 0;
		font-size: 1.3em;
		line-height: 1.6;
		width: 60%;
		height: auto;
		float: right;
	}
	#about_wrap > div > ul li a p.ph {
		height: auto !important;
	}
	#about_wrap > div > ul li a p br {
		display: none;
	}
	#about_wrap > div > ul li a .item_cover img {
		width: 35%;
		height: auto;
		float: left;
	}
	#about_wrap > div > .nano_lineup li .lineup_img {
		margin-top: -60px;
		padding-right: 15px;
		width: 38%;
		height: auto;
	}
	#about_wrap > div > .nano_lineup li a p {
		margin-left: 15px;
		width: 50%;
	}
}


/*	03 : #main > #about										// about.html
---------------------------------------------------------------------- */
#main > #about {}
#main > #about h3 {
	margin-bottom: 20px;
}
#main > #about h4 {
	margin-bottom: 40px;
}
#main > #about .about_box { margin-bottom: 35px; }
#main > #about .about_box > div { margin-bottom: 30px;}
#main > #about .about_box > div h5 {
	background: url(../images/line01.png) left top repeat-x;
	margin-bottom: 30px;
	padding-top: 30px;
}
#main > #about .about_box > div div {
	margin-bottom: 40px;
}
#main > #about .about_box > div div img {
	margin-bottom: 10px;
}
#main > #about .about_box > div p {
	font-size: 1.2em;
	clear: both;
	overflow: hidden;
}
#main > #about .about_box > div p > img {
	display: block;
	margin-bottom: 8px;
}

#main > #about .about_box > div div:last-child { margin-bottom: 0; }

#main > #about .about_box > div .clearfix { margin-bottom: 20px; }
#main > #about .about_box > div .clearfix div { margin-bottom: 0; }

#main > #about .voice_box {}
#main > #about .voice_box h5 {}
#main > #about .voice_box .care ,
#main > #about .voice_box .sport {
	background: #EDF9FE;
	padding: 0 30px;
}
#main > #about .voice_box .care h6 ,
#main > #about .voice_box .sport h6 {
	border-bottom: 1px solid #39F;
	margin-bottom: 20px;
}

#main > #about .voice_box .care {
	padding-top: 30px;
}
#main > #about .voice_box .care dl {
	padding-bottom: 30px;
}
#main > #about .voice_box .care dl dt {
	line-height: 1;
	margin-bottom: 15px;
}
#main > #about .voice_box .care dl dd {
	font-size: 12px;
	line-height: 1.4;
}

#main > #about .voice_box .sport {
	padding-bottom: 30px;
}
#main > #about .voice_box .sport .clearfix {}
#main > #about .voice_box .sport .clearfix .Right_item {
	margin-left: 35px;
}
#main > #about .voice_box .sport .clearfix p {
	font-size: 12px;
	line-height: 1.4;
}
#main > #about .voice_box .sport .clearfix p img {
	display: block;
	margin-bottom: 15px;
}






/*	04 : #main > #maintenance						// maintenance.html
---------------------------------------------------------------------- */
#main > #maintenance {}
#main > #maintenance h3 {
	margin-bottom: 20px;
}
#main > #maintenance h4 {
	margin-bottom: 40px;
}
#main > #maintenance .maintenance_box {}
#main > #maintenance .maintenance_box h5 {
	background: url(../images/line01.png) left top repeat-x;
	margin-bottom: 30px;
	padding-top: 30px;
}
#main > #maintenance .maintenance_box div {
	margin-bottom: 30px;
}
#main > #maintenance .maintenance_box p {
	font-size: 12px;
	line-height: 1.4;
	margin-bottom: 5px;
}
#main > #maintenance .maintenance_box p:last-child {
	margin-bottom: 0;
}
#main > #maintenance .maintenance_box p small {
	display: block;
	text-align: right;
}





/*	05 : #main > #comfort								// comfort.html
---------------------------------------------------------------------- */
#main > #comfort {}
#main > #comfort h3 {
	margin-bottom: 20px;
}
#main > #comfort h4 {
	margin-bottom: 40px;
}
#main > #comfort .comfort_box {}
#main > #comfort .comfort_box h5 {
	margin-bottom: 30px;
}
#main > #comfort .comfort_box h6 {
	border-bottom: 1px solid #CCC;
	margin-bottom: 25px;
	padding-bottom: 8px;
}
#main > #comfort .comfort_box > div {
	margin-bottom: 60px ;
}
@media screen and (max-width: 768px) {
	#main > #comfort .comfort_box > div {
		margin-bottom: 20px ;
	}
}
#main > #comfort .comfort_box > div div {
	margin-bottom: 20px;
}
#main > #comfort .comfort_box p {
	font-size: 12px;
	line-height: 1.6;
	margin-bottom: 5px;
}
#main > #comfort .comfort_box p small {
	display: block;
	font-size: 0.85em;
	line-height: 1.4;
	margin-top: 10px;
}
#main > #comfort .comfort_box .clearfix {}
#main > #comfort .comfort_box .clearfix .Left_box {
	margin-right: 30px;
}
#main > #comfort .comfort_box .clearfix div {
	text-align: center;
}
#main > #comfort .comfort_box .clearfix div p {
	margin-top: 10px;
	overflow: hidden;
	text-align: left;
}





/*	06 : #main > #mechanism								// mechanism.html
---------------------------------------------------------------------- */
#main > #mechanism {}
#main > #mechanism h3 {
	margin-bottom: 20px;
}
#main > #mechanism h4 {
	margin-bottom: 40px;
}

#main > #mechanism .mechanism_box {}
#main > #mechanism .mechanism_box h5 {
	margin-bottom: 15px;
}
#main > #mechanism .mechanism_box div {
	margin-bottom: 20px;
}
#main > #mechanism .mechanism_box div:last-child {
	margin-bottom: 0;
}




/*	07 : #main > #introduction-example		// introduction-example.html
---------------------------------------------------------------------- */
#main > #introduction-example {}
#main > #introduction-example h3 {
	margin-bottom: 20px;
}
#main > #introduction-example h4 {
	margin-bottom: 40px;
}





/*	08 : #main > #lineup									// lineup.html
---------------------------------------------------------------------- */
#main > #lineup {}
#main > #lineup h3 {
	margin-bottom: 30px;
}

#main > #lineup .lineup_box {
	margin-bottom: 30px;
}
#main > #lineup .lineup_box h4 {
	margin-bottom: 25px;
}
#main > #lineup .lineup_box .clearfix {
	margin-bottom: 25px;
}
#main > #lineup .lineup_box .clearfix > div:first-child {
	float: left;
	width: 245px;
}
#main > #lineup .lineup_box .clearfix > div.lineup01:first-child {
	width: 380px;
}
#main > #lineup .lineup_box .clearfix > div:last-child {
	float: left;
	margin: 40px 0 0 40px;
	width: 395px;
}
#main > #lineup .lineup_box .clearfix > div.lineup01:last-child {
	margin: 0 0 0 35px;
	width: 314px;
}
#main > #lineup .lineup_box .clearfix > div:last-child .item_spec {
	border-top: 1px solid #000;
	padding-top: 3px;
	margin-top: 25px;
}
#main > #lineup .lineup_box .clearfix > div:last-child .item_spec p {
	border-bottom: 1px solid #000;
	font-size: 1.6em;
	font-weight: bold;
	line-height: 1;
	margin-bottom: 3px;
	padding: 3px 0;
	text-align: center;
}
#main > #lineup .lineup_box .clearfix > div:last-child .info_item {
	margin-top: 20px;
}
#main > #lineup .lineup_box .clearfix > div:last-child .info_item p {
	border-bottom: 1px solid #000;
	text-align: center;
	font-size: 1.2em;
	font-weight: bold;
	margin-bottom: 3px;
	padding-bottom: 3px;
}
#main > #lineup .lineup_box .clearfix > div:last-child .info_item p:last-child {
	border-bottom: none;
	margin-bottom: 0;
	letter-spacing: -1px;
}
#main > #lineup .lineup_box .clearfix > div:last-child .info_item p strong {
	font-size: 1.6em;
	padding-left: 20px;
}
#main > #lineup .lineup_box .clearfix > div:last-child .info_item p em {
	font-size: 1.6em;
	padding-left: 10px;
}
#main > #lineup .lineup_box .clearfix > div:last-child .info_item_ido p {
	border-bottom: 1px solid #000;
	font-size: 1em;
	font-weight: bold;
	margin-bottom: 3px;
	padding-bottom: 3px;
}
.lineup02_ido img {
	float: left;
}

.lineup02_ido02 {
	margin-top: 50px;
}

@media screen and (max-width: 768px) {
	#main > #lineup .lineup_box .clearfix > div:first-child {
		float: none;
		width: 100%;
		text-align: center;
	}
	#main > #lineup .lineup_box .clearfix > div:last-child {
		margin: 20px 0 0 0 !important;
		float: none;
		width: 100%;
	}
	#main > #lineup .lineup_box .clearfix > div.lineup01:first-child {
		width: 100%;
		text-align: left;
	}
	#main > #lineup .lineup_box .clearfix > div.lineup01:last-child {
		margin: 0 !important;
		width: 100%;
	}
	#main > #lineup .lineup_box .clearfix > div.lineup01:last-child img {
		width: 100%;
	}
}


#main > #lineup .lineup_box .clearfix + div {
	background: url(../images/line01.png) left top repeat-x;
	padding-top: 10px;
	text-align: right;
}





/*	99: layout.css の 上書き
---------------------------------------------------------------------- */
#nf_top > #header {
	margin-top: 11px;
}
#nf_top > #header .clearfix {
	margin-bottom: 15px;
}
#header .clearfix h2 {
	margin-top: 23px;
}

#sub div {
	margin-bottom: 20px;
}
#sub #snav > dl dd:nth-child(6) {
	background: none;
}
#sub #snav > dl dd > a {
	background-image: url(../../nanofeel/img/list.png);
}
#sub #snav > dl dt {
	color: #47A5D1;
	padding-top: 30px;
}
#sub #snav > dl dt > a,
#sub #snav > dl dd.active > a,
#sub #snav > dl dd > a:hover ,
#sub #snav > dl dd > ul > li.active > a,
#sub #snav > dl dd > ul > li > a:hover {
	color: #47A5D1;
}
#sub #snav > dl dd > ul > li > a {
	background-image: url(../../nanofeel/img/arrow.png);
}

#pankuzu {
	border-top: 2px solid #47A5D1;
}
@media screen and (max-width: 768px) {
	#pankuzu {
		padding: 10px 15px 5px 15px;
	}
}


/*	20150701 追加・修正
---------------------------------------------------------------------- */
#about_wrap > div:nth-child(1) {
	padding: 30px 0 0;
}

#about_wrap > div:nth-child(2) {
	padding: 0 0 30px;
}
@media screen and (max-width: 768px) {
	#about_wrap > div:nth-child(2) {
		padding: 0 0 10px;
	}
}

#about_wrap > div > h3 {
	margin-top: 40px;
}

#about_wrap > div > ul li a p.ph {
	height: 110px;
}

#main > #introduction-example h4:nth-of-type(2) {
	background: url("../images/line01.png") repeat-x left top;
	margin-top: 40px;
	padding-top: 30px;
}

#main > #introduction-example .about_box { margin-bottom: 35px; }
#main > #introduction-example .about_box > div { margin-bottom: 30px;}
#main > #introduction-example .about_box > div h5 {
	background: url(../images/line01.png) left top repeat-x;
	margin-bottom: 30px;
	padding-top: 30px;
}
#main > #introduction-example .about_box > div div {
	margin-bottom: 40px;
}
#main > #introduction-example .about_box > div div img {
	margin-bottom: 10px;
}
#main > #introduction-example .about_box > div p {
	font-size: 1.2em;
	clear: both;
	overflow: hidden;
}
#main > #introduction-example .about_box > div p > img {
	display: block;
	margin-bottom: 8px;
}
@media screen and (max-width: 768px) {
	#main > #introduction-example .about_box > div div img {
		width: 100%;
	}
}

#main > #introduction-example .about_box > div div:last-child { margin-bottom: 0; }

#main > #introduction-example .about_box > div .clearfix { margin-bottom: 20px; }
#main > #introduction-example .about_box > div .clearfix div { margin-bottom: 0; }

#main > #introduction-example .voice_box {}
#main > #introduction-example .voice_box h5 {}
#main > #introduction-example .voice_box .care ,
#main > #introduction-example .voice_box .sport {
	background: #EDF9FE;
	padding: 0 30px;
}
#main > #introduction-example .voice_box .care h6 ,
#main > #introduction-example .voice_box .sport h6 {
	border-bottom: 1px solid #39F;
	margin-bottom: 20px;
}

#main > #introduction-example .voice_box .care {
	padding-top: 30px;
}
#main > #introduction-example .voice_box .care dl {
	padding-bottom: 30px;
}
#main > #introduction-example .voice_box .care dl dt {
	line-height: 1;
	margin-bottom: 15px;
}
#main > #introduction-example .voice_box .care dl dd {
	font-size: 12px;
	line-height: 1.4;
}

#main > #introduction-example .voice_box .sport {
	padding-bottom: 30px;
}
#main > #introduction-example .voice_box .sport .clearfix {}
#main > #introduction-example .voice_box .sport .clearfix .Right_item {
	margin-left: 35px;
}
#main > #introduction-example .voice_box .sport .clearfix p {
	font-size: 12px;
	line-height: 1.4;
}
#main > #introduction-example .voice_box .sport .clearfix p img {
	display: block;
	margin-bottom: 15px;
}

@media screen and (max-width: 768px) {
	#main > #introduction-example .voice_box .care, 
	#main > #introduction-example .voice_box .sport {
		padding: 10px;
	}
	#main > #introduction-example .voice_box .care dl {
		margin-bottom: 10px;
	}
}

#main > #lineup h3 {
	margin-bottom: 20px;
}

#main > #lineup h3 + p {
	margin-bottom: 40px;
}

#main > #lineup .lineup_box .detail {
	background: url(../images/line01.png) left top repeat-x;
	margin-top: 30px;
	padding-top: 30px;
}

#main > #lineup .lineup_box .detail02 {
	margin-top: 30px;
	padding-top: 30px;
}


#main > #lineup .lineup_box .attention01 {
	border: 1px solid #000;
	padding: 5px;
}

.box_mt20 {
	margin-top: 30px;
}

#main > #lineup .about_box > div { margin-bottom: 30px;}
#main > #lineup .about_box > div h5 {
	margin-bottom: 30px;
}
#main > #lineup .about_box > div div {
	margin-bottom: 0;
}
#main > #lineup .about_box > div div img {
	margin-bottom: 10px;
}

#main > #lineup .maintenance_box h5 {
	background: url(../images/line01.png) left top repeat-x;
	margin-bottom: 30px;
	padding-top: 30px;
}
#main > #lineup .maintenance_box div {
	margin-bottom: 30px;
}
#main > #lineup .maintenance_box p {
	font-size: 12px;
	line-height: 1.4;
	margin-bottom: 5px;
}
#main > #lineup .maintenance_box p:last-child {
	margin-bottom: 0;
}
#main > #lineup .maintenance_box p small {
	display: block;
	text-align: right;
}

#main > #lineup .lineup_box .clearfix > div:last-child {
	margin-top: 5px;
}

#main > #lineup .lineup_box .spec_box {
	margin: 30px 0;
}
@media screen and (max-width: 768px) {
	#main > #lineup .lineup_box .spec_box {
		margin: 10px 0;
	}
}

#main > #lineup .lineup_box .clearfix > div:last-child .info_item p:last-child {
	letter-spacing: 0;
}

#main > #lineup .lineup_box .clearfix > div:last-child .item_spec {
	margin-top: 10px;
}

.txt_icon {
	background: #6589c6;
	border-radius: 2px;
	color: #fff;
	display: inline-block;
	font-size: 1.2em;
	padding: 3px 0.5em;
}

sup, sub {
	font-size: 0.75em;
	font-weight: normal;
}

sup {
	vertical-align: top;
}

sub {
	vertical-align: bottom;
}

#sub #snav > dl dd:nth-child(6) {
	background: url("../images/line01.png") repeat-x left bottom;
}

.lineup_box.lineup2 .about_box p {
	font-size: 12px;
	line-height: 1.6;
	margin: 0 0 1em;
}


/*	レスポンシブ対応
---------------------------------------------------------------------- */

/* 共通部分 */
#footer_wrap #footer #fgnavi > li.home a span {
	display: none;
}
#sub #snav {
	border-top: 11px solid #47A5D1;
	border-bottom: 1px solid #CCC;
	border-radius: 4px;
}
@media screen and (max-width: 768px) {
	#header_wrap {
		position: relative !important;
		padding: 0;
		border: none;
	}
	#header, #gnavi, .container, #pageup, #footer {
		width: 100%;
		overflow: visible;
	}
	#header_wrap + .container {
		padding-top: 0 !important;
	}
	#header_wrap #gnavi {
		display: none;
	}
	#header {
		padding: 0;
		box-sizing: border-box;
	}
	#header .clearfix h1 img {
		margin-right: 10px;
		width: 150px;
	}
	#about_wrap > div {
		width: 100%;
	}
	#nf_top > #header, 
	.container #header {
		margin-top: 0;
	}
	#header .clearfix {
		position: relative;
		z-index: 9999;
		margin: 0 !important;
		padding: 18px 10px 17px 10px;
		background-color: #fff;
	}
	#header .clearfix h2 {
		display: inline-block;
		margin: 0;
		float: none;
	}
	#header .clearfix h2 img {
		padding-top: 10px;
		width: 70px;
	}
	#pageup {
		margin-top: 15px;
	}
	#pageup a {
		float: none;
		text-align: center;
	}
	#footer_wrap {
		border-top: none;
	}
	#footer_wrap #footer {
		margin-top: 0;
	}
	#footer_wrap #footer #fgnavi {
		background-color: #579AD7;
	}
	#footer_wrap #footer #fgnavi > li, 
	#footer_wrap #footer #fgnavi > li.home, 
	#footer_wrap #footer #fgnavi > li > ul {
		margin-right: 0;
		float: none;
	}
	#footer_wrap #footer #fgnavi > li.home a img {
		display: none;
	}
	#footer_wrap #footer #fgnavi > li.home a span {
		display: block;
	}
	#footer_wrap #footer #fgnavi > li.home > a, 
	#footer_wrap #footer #fgnavi > li.topics > a, 
	#footer_wrap #footer #fgnavi > li.products > a, 
	#footer_wrap #footer #fgnavi > li.nc > a, 
	#footer_wrap #footer #fgnavi > li.woa > a, 
	#footer_wrap #footer #fgnavi > li.trial > a {
		padding: 1em 15px;
		color: #fff;
		font-size: 12px;
		width: 100%;
		border-bottom: 1px solid #4888c2;
	}
	#footer_wrap #footer #fgnavi > li > a, 
	#footer_wrap #footer #fgnavi > li.other a, 
	#footer_wrap #footer #fgnavi > li.other a {
		display: block;
		padding: 1em 15px;
		color: #fff;
		background: none;
		border-bottom: 1px solid #4888c2;
	}
	#footer_wrap #footer #fgnavi > li > ul {
		margin-top: 10px;
		padding-bottom: 10px;
		border-bottom: 1px solid #4888c2;
	}
	#footer_wrap #footer #fgnavi > li > ul li {
		margin-top: 0;
	}
	#footer_wrap #footer #fgnavi > li > ul li a {
		display: block;
		padding: .5em 15px;
		color: #fff;
	}
	#footer_wrap #footer #fgnavi > li.woa ul.bn {
		margin-bottom: -10px;
		padding-bottom: 0;
		border-bottom: none;
	}
	#footer_wrap #footer #fgnavi > li.other ul.bn {
		margin-top: 0;
		padding-bottom: 0;
		border-bottom: none;
	}
	#footer_wrap #footer #fgnavi > li.other, 
	#footer_wrap #footer #fgnavi > li.other > ul li {
		margin-top: 0;
	}
	#footer_wrap #footer #logo {
		margin: 15px auto 5px auto;
	}
	#footer_wrap #footer #copy {
		margin-bottom: 15px;
	}
	img {
		max-width: 100%;
		height: auto;
	}
	#main {
		padding: 0 15px;
		width: 100%;
		float: none;
		box-sizing: border-box;
	} 
	#sub {
		margin-top: 25px;
		width: 100%;
		float: none;
	}
	#sub #snav {
		border-right: none;
		border-left: none;
		border-radius: 0;
	}
	#sub .bnr {
		padding: 0 15px;
	}
	#sub .bnr img {
		width: 100%;
	}
}

/* ドロワーメニュー */
#sp_nav {
	display: none;
}
.fixed {
	overflow: hidden;
	position: fixed;
	height: 100%;
	width: 100%;
}
@media screen and (max-width: 768px) {
	#sp_nav {
		display: block;
		position: relative;
		z-index: 10000;
	}
	.drawer-hamburger {
		position: absolute !important;
		top: -62px !important;
		background-color: #579AD7 !important;
	}
	.drawer-hamburger-icon, .drawer-hamburger-icon:before, .drawer-hamburger-icon:after {
		background-color: #fff !important;
	}
	.drawer-open .drawer-hamburger-icon {
		background-color: transparent !important;
	}
	.drawer--top.drawer-open .drawer-nav {
		top: 60px !important;
	}
	.drawer-menu {
		padding: 0 0 70px 0 !important;
	}
	.drawer-menu a {
		display: block;
		padding: 15px 15px;
		color: #579AD7;
		font-size: 1.4em;
		border-top: 1px solid #ddd;
	}
	.drawer-dropdown-menu-item {
		color: #579AD7 !important;
		font-size: 1.4em !important;
		line-height: 1.4 !important;
	}
	.drawer-menu .drawer-dropdown-menu {
		margin-bottom: 10px;
	}
	.drawer-menu a.drawer-dropdown-menu-item {
		padding: 7px 15px 7px 30px;
		border-top: none;
	}
}

/* 見出し */
.ttl01 {
	font-family: 'Noto Serif JP', serif;
	color: #47a5d1;
	font-size: 3.8em;
	line-height: 1.3;
}
	.ttl01 .small {
		font-size: .4em;
	}
.ttl02 {
	padding: 10px;
	font-family: 'Noto Serif JP', serif;
	color: #fff;
	font-size: 2.2em;
	line-height: 1.3;
	background-color: #53c2f0;
	text-align: center;
}
#main > #introduction-example .about_box > div p.ttl03 {
	position: relative;
	padding: 0 0 7px 15px;
	color: #3399ff;
	font-size: 1.5em;
	font-weight: bold;
}
#main > #introduction-example .about_box > div p.ttl03::after {
	position: absolute;
	top: 2px;
	left: 0;
	z-index: 2;
	content: '';
	width: 6px;
	height: 6px;
	border: 3px solid #3399ff;
	border-radius: 100%
}
.ttl04 {
	font-size: 2.2em;
	font-weight: bold;
	line-height: 1.3;
}
.ttl_cover {
	margin-bottom: 20px !important;
	padding-left: 10px;
	border-left: 8px solid #53c2f0;
}
	.ttl_cover h5 {
		margin-bottom: 10px !important;
		color: #47a5d1;
		font-size: 2em;
		font-weight: bold;
	}
	.ttl_cover p {
		font-size: 1.4em;
		line-height: 1.4;
	}
.catch {
	font-family: 'Noto Serif JP', serif;
	color: #47a5d1;
	font-size: 1.9em;
}
.catch02 {
	color: #36a0da;
	font-size: 2.3em;
	font-weight: bold;
}
@media screen and (max-width: 768px) {
	.ttl01 {
		font-size: 2.8em;
	}
	.ttl02 {
		font-size: 1.7em;
	}
	.ttl04 {
		font-size: 1.6em;
	}
	.catch {
		font-size: 1.6em;
	}
	.catch02 {
		font-size: 1.8em;
	}
}

/* .movie02 */
@media screen and (max-width: 768px) {
	.movie02 {
		margin: 25px 0 0 0;
		padding: 0 15px;
		width: 100%;
		box-sizing: border-box;
	}
	.movie02 li {
		width: 100%;
		float: none;
	}
	.movie02 li.movie02_r {
		margin: 0;
	}
}

/* comfort */
.ttl01 .point, 
.ttl_kashitsu .point, 
.ttl_shosyu .point, 
.ttl_jokin .point, 
.ttl_kusei .point {
	margin: 0 0 0 5px;
	padding: 2px 10px;
	font-family: "メイリオ", meiryo, Osaka, 'Lucida Grande', Helvetica, "ＭＳ Ｐゴシック", sans-serif;
	color: #fff;
	font-size: .45em;
	border-radius: 5px;
	background-color: #ccc;
	border: 1px solid #bbb;
}
.ttl01 .point.point01, .ttl_kashitsu .point.point01 { background-color: #e9598a; background: linear-gradient(to bottom, #e7607e, #ee9ec1); border-color: #e7607e; }
.ttl01 .point.point02, .ttl_shosyu .point.point02 { background-color: #48bb5e; background: linear-gradient(to bottom, #00a63c, #c0da99); border-color: #00a63c; }
.ttl01 .point.point03, .ttl_jokin .point.point03 { background-color: #20aaad; background: linear-gradient(to bottom, #029d9f, #85cada); border-color: #029d9f; }
.ttl01 .point.point04, .ttl_kusei .point.point04 { background-color: #19aaeb; background: linear-gradient(to bottom, #059fdf, #73caf7); border-color: #059fdf; }
.ttl_kashitsu, .ttl_shosyu, .ttl_jokin, .ttl_kusei {
	font-family: 'Noto Serif JP', serif;
	font-size: 2.3em;
}
.ttl_kashitsu { color: #ef5b8d; }
.ttl_shosyu { color: #48bb5e; }
.ttl_jokin { color: #20aaad; }
.ttl_kusei { color: #19aaeb; }
	.ttl_kashitsu .point, 
	.ttl_shosyu .point, 
	.ttl_jokin .point, 
	.ttl_kusei .point {
		margin: 0 5px 0 0;
		font-size: .6em;
	}
@media screen and (max-width: 768px) {
	.bk {
		display: block;
		margin-top: 8px;
	}
	.ttl_kashitsu, .ttl_shosyu, .ttl_jokin, .ttl_kusei {
		font-size: 1.8em;
	}
	.Left, .Left_box, .Left_item, 
	.Right, .Right_box, .Right_item {
		float: none;
	}
	.Right_item {
		margin-top: 10px;
	}
}

