/*
Theme Name: dual task Theme
Theme URI: http://www.www.www/
Description: This is my dual task theme.
*/
@import "css/nav2.css";
@import "css/form.css";
@import "css/footer.css";

/* --------------------------------------------------
	ベース
-------------------------------------------------- */
html {
	height: 100%;
	margin: 0;
	padding: 0;
	overflow-y: scroll;
	-webkit-text-size-adjust: 100%;
	overflow-y: scroll;
	}

body {
	height: 100%;
	margin: 0;
	padding: 0;
	color: #555;
	font-size: 14px;
	font-family: Myriad, Helvetica, Arial, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", sans-serif;
	line-height: 1.7;
    word-wrap: break-word;
    -webkit-tap-highlight-color: rgba(0,0,0,0); 　
	-webkit-text-size-adjust: 100%;
	background-color: #fff;
	} 
	
html.osMac body, body.osMac {
    font-family: Myriad, Helvetica, Arial, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", sans-serif;
	}

* {
	margin: 0;
	padding: 0;
	}
	
/* --------------------------------------------------
	テキスト
-------------------------------------------------- */
h1, h2, h3, h4, h5, h6, p, a { color: #555; }
h1 { font-size: 300%; margin: 0 0 20px; }
h2 { font-size: 240%; margin: 0 0 20px; color:#2d447c; line-height: 1.2;}
h3 { font-size: 150%; margin: 0 0 20px; }
h4 { font-size: 130%; margin: 0 0 20px; }
h5 { font-size: 120%; margin: 0 0 20px; }
h6 { font-size: 80%; margin: 0 0 20px; }
	
p { font-size: 16px;
	line-height: 1.7;
	text-decoration: none;
	margin: 0 0 30px;
	padding:0;
	}
	
a {
	text-decoration: none;
	}	
	
a:hover {
	opacity: 0.6;
	color: #888;
	text-decoration: none;
		-webkit-transition: all 0.3s;
            transition: all 0.3s;
	}
	
div {
	color: #555;
	}
	
span {
	color: #555;
	}

.red {
	color: #C00;
	}

.cha {
	color: #917347;
	}

.pink {
	color: #F9C !important;
	}

.green {
	color: #6C6 !important;
	}

.blue {
	color: #6CF !important;
	}

.center {
	text-align: center !important;
}

.left {
	text-align: left !important;
}

hr {
	color: inherit;
	border: none;
	clear: both;
}

/* --------------------------------------------------
	リスト
-------------------------------------------------- */
li {
	list-style: none;
	}
	
/* --------------------------------------------------
	イメージ
-------------------------------------------------- */
img {
	border: none;
	margin: 0;
	padding: 0;
	}
	
/* --------------------------------------------------
	コンテナ
-------------------------------------------------- */
#container {
	margin: 0 auto 0;
	padding: 0;
	background-color: #fff;
	}

/* --------------------------------------------------
	ヘッダー
-------------------------------------------------- */
header {
	width: 90%;
	height: auto;
	margin: 0 auto;
	padding: 0 5%;
	position: fixed;
	z-index: 9999999999999999999999999;
	background-image: url(image/white90.png);
	background-repeat: repeat;
	}

#logo {
	width: 210px;
	height: auto;
	margin: 20px auto;
	padding: 0;
	float: left;
	}

#logo img {
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
	vertical-align: middle
	}

/* --------------------------------------------------
	ヘッダーイメージ
-------------------------------------------------- */
#slide {
	clear: both;
	width: 100% !important;
	height: auto;
	margin: 0 auto 0;
	padding:0;
	}

#slide img {
	width: 100% !important;
	height: auto;
	margin: 0 auto;
	padding:0;
	vertical-align: middle;
	text-align: center !important;
	}

#slide a:hover {
	opacity: 1.0;
	}
	
/* --------------------------------------------------
	コンテンツ
-------------------------------------------------- */
#content-top {
	width: 100%;
	margin: auto;
	padding: 35px 0 0;
	background-image: url(image/newsback.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	}

#content-voice {
	width: 100%;
	margin: auto;
	padding: 80px 0 0;
	background-image: url(image/voiceback.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	}

#content-faq {
	width: 100%;
	margin: auto;
	padding: 80px 0 0;
	background-image: url(image/faqback.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	}

#content-senior {
	width: 100%;
	margin: auto;
	padding: 0;
	background-image: url(image/seniorback.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	}
			
#content {
	width: 100%;
	margin: 0 auto;
	padding: 80px 0 0%;
	background-image: url(image/about-back.png);
	background-size: 100%;
	background-position: top;
	background-repeat: no-repeat;
	}

#content-howto {
	width: 100%;
	margin: 0 auto;
	padding: 0;
	}
	
#content-non {
	width: 100%;
	margin: 0 auto;
	padding: 80px 0 0%;
	}
	
#content .inner,#content-voice .inner,#content-mat300j .inner {
	margin: 0 auto;
	padding: 0 5% 0;
	max-width: 960px;
	}

#content-non .inner {
	margin: 0 auto;
	padding: 0 5% 0;
	max-width: 680px;
	}
		
.inner {
	margin: 0 auto;
	padding: 0 5% 0;
	}

.inner980 {
	margin: 0 auto;
	padding: 0 5% 0;
	max-width: 960px;
	position: relative;
	}
	
/* --------------------------------------------------
	ページタイトル
-------------------------------------------------- */
#pagetitle {
	width: 100%;
	margin: auto;
	padding: 110px 0 0;
	text-align: center;
	}

#pagetitle .titleimage {
	width: 100%;
	max-width: 300px;
	margin: auto;
	padding: 0;
	}

#pagetitle .titleimage img {
	margin: 0 auto 5px;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}

#pagetitle p.sub {
	font-size: 14px;
	letter-spacing: 1px;
	margin: 0 0 30px;
	padding: 0;
	line-height: 14px;
	font-weight: lighter;
	}

/* --------------------------------------------------
	ページイメージ
-------------------------------------------------- */
#pageimage {
	width: 100%;
	margin: auto;
	padding: 0;
	text-align: center;
	}

#pageimage img {
	margin: 0 auto 0;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}

/* --------------------------------------------------
	セクション
-------------------------------------------------- */
section {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0 0 80px;
	}

section.blueback {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 80px 0 60px;
	background-image: url(image/blue.png);
	}

section.blueback h2,section.blueback p {
	color: #fff;
	}

section.seniorblue {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 50px 0 50px;
	background-image: url(image/blue.png);
	}

section.seniorblue h2,section.seniorblue p {
	text-align: center;
	color: #fff;
	}

section.middleagegreen {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 50px 0 50px;
	background-image: url(image/green.png);
	}

section.middleagegreen h2 {
	text-align: center;
	color: #fff;
	}

section.middleagegreen p {
	text-align: left;
	color: #fff;
	margin: 0;
	}

section.white {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 50px 0;
	background-color: #fff;
	}

section.usukon {
	clear: both;
	width: 98%;
	height: auto;
	margin: 0 auto 20px;
	padding: 50px 0;
	background-color: #e2e0ea;
	}
	
section.seniorblue2 {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 50px 0;
	background-image: url(image/blue2.png);
	}

section.orange {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 50px 0 50px;
	background-color: #dd9731;
	}

section.orange p {
	text-align: center;
	color: #fff;
	}

section.middleagegreen p {
	text-align: center;
	color: #fff;
	margin: 0;
	}
	
.graf {
	width: 100%;
	max-width: 840px;
	margin: 0 auto;
	padding: 0;
	text-align: center;
	}

.graf-last {
	width: 100%;
	max-width: 840px;
	margin: 60px auto 0;
	padding: 0;
	text-align: center;
	}
	
.graf img,.graf-last img {
	margin: 0 auto 0;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}
			
.box {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0 auto 30px;
	padding: 0;
	}

.arrowimage-blue {
	width: 100%;
	margin: 0 auto;
	padding: 0;
	text-align: center;
	background-image: url(image/blue.png);
	}

.arrowimage-blue2 {
	width: 100%;
	margin: 0 auto;
	padding: 0;
	text-align: center;
	background-image: url(image/blue2.png);
	}

.arrowimage-green {
	width: 100%;
	margin: 0 auto;
	padding: 0;
	text-align: center;
	background-image: url(image/green.png);
	}
	
.arrowimage-orange {
	width: 100%;
	margin: 0 auto;
	padding: 0;
	text-align: center;
	background-color: #dd9731;
	}
	
.arrowimage-blue img,.arrowimage-blue2 img,.arrowimage-green img,.arrowimage-orange img {
	margin: 0 auto 0;
	padding: 0 !important;
	width: 100%;
	height: auto;
	vertical-align: bottom;
	line-height:0;
	}

.howto {
	width: 100%;
	margin: 0 auto;
	padding: 0;
	text-align: center;
	}

.howto img {
	margin: 0 auto 0;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}
	
.stepimage {
	width: 100%;
	margin: 0 auto 50px;
	padding: 0;
	text-align: center;
	max-width: 766px;
	height: auto;
	min-height: 100px;
	background-image: url(image/howto-step-back.jpg);
	background-size: cover;
	}

.stepimage img {
	margin: 0 auto 0;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}

.step-title {
	width: 100%;
	margin: 50px auto 0;
	padding: 0;
	text-align: center;
	max-width: 766px;
	}

.step-start {
	width: 100%;
	margin: 0 auto;
	padding: 0;
	text-align: center;
	max-width: 766px;
	}
	
.step-title img,.step-start img {
	margin: 0 auto 0;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}
	
.ashiato {
	width: 100%;
	margin: 0 auto;
	padding: 0;
	text-align: center;
	max-width: 766px;
	}

.ashiato2 {
	width: 100%;
	margin: 0 auto;
	padding: 0;
	text-align: center;
	max-width: 766px;
	}
	
.ashiato img,.ashiato2 img {
	margin: 0 auto 0;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}
	
.design {
	width: 100%;
	margin: 0 auto 100px;
	padding: 0;
	text-align: center;
	}

.design img {
	margin: 0 auto 0;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}

.products-bnr {
	margin: 30px auto;
	width: 95%;
	height: auto;
}

.products-bnr img {
	margin: 0 auto 0;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}

p.textyellow {
	font-size: 450%;
	font-weight: bold;
	color: #FF0 !important;
	margin: 0 0 10px;
	line-height: 1.4;
}

p.textyellow02 {
	font-size: 260%;
	font-weight: bold;
	color: #FF0 !important;
	margin: 0 0 10px;
	line-height: 1.4;
}

p.sankaku {
	font-size: 200%;
}

p.textblue {
	font-size: 200%;
	font-weight: bold;
	color: #384679 !important;
	margin: 0;
	line-height: 1.4;
	text-align: center;
}

section.dt {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 50px 0;
	background-color: #fff;
	}
/* --------------------------------------------------
	TOPページ
-------------------------------------------------- */
.topbox1 {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0 auto 30px;
	padding: 0;
	display: block;
	}

.topbox1 a {
	width: 100%;
	height: auto;
	display: block;
	margin: 0;
	padding: 0;
	}
	
.topbox1-left {
	float: left;
	width: 50%;
	height: auto;
	margin: 0;
	padding: 0;
	overflow: hidden;
	position: relative;
	}

.topbox1-left .text {
	position: absolute;
	display: block;
	padding: 13% 0 0;
	margin: 0;
	width: 100%;
	}

.topbox1-left .text p.midashi {
	font-size: 180%;
	margin: 0 0 25px;
	padding: 0;
	line-height: 1.2;
	color: #2d447c;
	font-weight: bold;
	}

.topbox1 p {
	font-size: 100%;
	line-height: 1.5;
	text-align: center;
	}
	
.topbox1-right {
	float: right;
	width: 50%;
	height: auto;
	margin: 0 0 20px;
	padding: 0;
	overflow: hidden;
	}

.topbox1-left img,.topbox1-right img {
	margin: 0 auto;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}

.topbox2 {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0 auto 30px;
	padding: 0;
	display: block;
	}

.topbox2 a {
	width: 100%;
	height: auto;
	display: block;
	margin: 0;
	padding: 0;
	}
		
.topbox2-left {
	float: left;
	width: 50%;
	height: auto;
	margin: 0;
	padding: 0;
	overflow: hidden;
	background-color: #b2d0db;
	}

.topbox2-left .text {
	position: absolute;
	padding: 50px 0 0 50px;
	width: auto;
	}

.topbox2-left .text p.midashi {
	font-size: 300%;
	margin: 0 0 10px;
	padding: 0;
	line-height: 1.2;
	}

.topbox2 .text p {
	color: #fff;
	font-size: 110%;
	line-height: 1.5;
	}
		
.topbox2-right {
	float: right;
	width: 50%;
	height: auto;
	margin: 0 0 20px;
	padding: 0;
	overflow: hidden;
	}

.topbox2-left img,.topbox2-right img {
	margin: 0 auto;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}
	
.topbox3-left {
	float: left;
	width: 49%;
	height: auto;
	margin: 0;
	padding: 0;
	overflow: hidden;
	display: block;
	}
	
.topbox3-right {
	float: right;
	width: 49%;
	height: auto;
	margin: 0 0 20px;
	padding: 0;
	overflow: hidden;
	display: block;
	}

.topbox3-left a,.topbox3-right a {
	width: 100%;
	height: auto;
	display: block;
	margin: 0;
	padding: 0;
	}
	
.topbox3-left .text,.topbox3-right .text {
	position: absolute;
	padding: 30px 0 0 30px;
	width: 250px;
	}

.topbox3 p {
	color: #fff;
	font-size: 110%;
	line-height: 1.5;
	}
	
.topbox3-left img,.topbox3-right img {
	margin: 0 auto 10px;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}

.voicetitle {
	width: 80px;
	height: auto;
	margin: 0;
	padding: 0;
}

.voicetitle img {
	margin: 0 auto 10px;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}
	
.topbox3 p.voicemidashi {
	font-size: 260%;
	margin: 0 0 10px;
	padding: 0;
	line-height: 1.0;
	}

/* --------------------------------------------------
	Aboutページ
-------------------------------------------------- */
p.midashi {
	font-size: 200%;
	margin: 0 0 20px;
	line-height: 1.3;
	}

p.midashi span {
	font-size: 65%;
	margin: 0;
	}
		
p.kadai {
	font-size: 200%;
	text-align: center;
	margin: 0 0 30px;
	line-height: 1.0;
	}

.arrow {
	text-align: center;
	clear: both;
	margin: 0 auto 50px;
	width: 30px;
	height: 15px;
	}

.arrow img {
	margin: 0 auto 0;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}

.box2-left10 {
	float: left;
	width: 10%;
	height: auto;
	margin: 0 0 20px;
	padding: 0 0 0 10%;
	overflow: hidden;
	}

.box2-right90 {
	float: right;
	width: 78%;
	height: auto;
	margin: 0 0 20px;
	padding: 0;
	overflow: hidden;
	}

.box2-left10 img,.box2-right90 img {
	margin: 0 auto 10px;
	width: 100%;
	height: auto;
	vertical-align: middle;
	border-radius: 10px;
	}
	
.box2-left30 {
	float: left;
	width: 30%;
	height: auto;
	margin: 0 0 13px;
	padding: 0;
	overflow: hidden;
	}

.box2-right70 {
	float: right;
	width: 65%;
	height: auto;
	margin: 0 0 13px;
	padding: 30px 0 0;
	overflow: hidden;
	}

.box2-left30 img,.box2-right70 img {
	margin: 0 auto 10px;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}

.kadai-link-box {
	max-width: 500px;
	margin: 50px auto 0;
}

.kadai-link {
	float: left;
	width: 45%;
	margin: 0 2.5%;
	text-align: center;
	background-color: #fff;
	}

.kadai-link a {
	display: inline-block;
	position: relative;
	background-color:#555;
	color: #fff !important;
	text-decoration: none !important;
	padding: 5px 0;
	text-align: center;
	font-size: 130%;
	margin: 0 auto;
	cursor: pointer;
	width: 100%;
	}

.dt-link-box {
	max-width: 500px;
	margin: 50px auto 0;
}

.dt-link {
	float: left;
	width: 45%;
	margin: 0 2.5%;
	text-align: center;
	background-color: #fff;
	}

.dt-link a {
	display: inline-block;
	position: relative;
	background-color:#555;
	color: #fff !important;
	text-decoration: none !important;
	padding: 10px 0;
	text-align: center;
	font-size: 130%;
	margin: 0 auto;
	cursor: pointer;
	width: 100%;
	}

.kadai3-1,.kadai3-2 {
	float: left;
	width: 25%;
	height: auto;
	margin: 0;
	margin-right: 12.5%;
}

.kadai3-3 {
	float: right;
	width: 25%;
	height: auto;
	margin: 0;
	margin-right: 0;
}

.kadai3image {
	width: 100%;
	height: auto;
	margin: 0 0 15px;
	overflow: hidden;
	border-radius: 50%;
	background-color: #fff;
}

.kadai3image a {
	border-radius: 50%;
	background-color: transparent;
	border: 2px solid #8a99da;
	display: block;
	padding: 6px;
}

.kadai3image a:hover {
	opacity: 1.0;
	border-radius: 50%;
	border: 8px solid #8a99da;
	display: block;
	padding: 0;
}

.kadai3image a.middle {
	border-color: #93bd3b;
}

.kadai3image a.kids {
	border-color: #dd9731;
}

.kadai3image a,
.kadai3image a::before,
.kadai3image a::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.kadai3image img {
	width: 100%;
	height: auto;
	vertical-align: middle;
	position: relative;
}

/* --------------------------------------------------
	Productsページ
-------------------------------------------------- */
.box-productstop {
	clear: both;
	width: 80%;
	height: auto;
	margin: 0 auto;
	padding: 0 0 0 20%;
	}

.image {
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
	}

.image img {
	margin: 0 auto;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}

.dttitle {
	width: 100%;
	max-width:680px;
	height: auto;
	margin: 0 auto 70px;
	padding: 0;
	}

.dttitle img {
	margin: 0 auto;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}

.dt-midashi {
	font-size: 175%;
	line-height: 1.4;
	font-weight: bold;
}

.box-mat {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0 auto 80px;
	padding: 0 0 60px;
	border-bottom: 1px dotted #fff;
	}

.box-carpet {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0 auto 0;
	padding: 0;
	}
		
.box2-left60 {
	float: left;
	width: 55%;
	height: auto;
	margin: 0;
	padding: 0;
	overflow: hidden;
	}

.box2-right40 {
	float: right;
	width: 35%;
	height: auto;
	margin: 0;
	padding: 0;
	overflow: hidden;
	}

.mat {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0 auto 0;
	padding: 10% 0;
	}
	
.carpet {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0 auto 0;
	padding: 0;
	}
	
.box2-left60 img,.box2-right40 img {
	margin: 0 auto 30px;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}

/* --------------------------------------------------
	Voiceページ
-------------------------------------------------- */
.box-aoyama {
	margin: 0 auto 60px;
}

.box-yamada {
	margin: 0 auto 0px;
}

#content-voice .box2-left40 {
	float: left;
	width: 40%;
	height: auto;
	margin: 20px 0 0;
	padding: 0;
	overflow: hidden;
	}

#content-voice .box2-right60 {
	float: right;
	width: 60%;
	height: auto;
	margin: 0;
	padding: 0;
	overflow: hidden;
	}

#content-voice .box2-left60 {
	float: left;
	width: 60%;
	height: auto;
	margin: 0;
	padding: 0;
	overflow: hidden;
	}

#content-voice .box2-right40 {
	float: right;
	width: 40%;
	height: auto;
	margin: 50px 0 0;
	padding: 0;
	overflow: hidden;
	}
	
#content-voice .box2-left40 img,#content-voice .box2-right60 img,#content-voice .box2-left60 img,#content-voice .box2-right40 img {
	margin: 0 auto 0;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}

#content-voice p {
	font-size: 110%;
}

#content-voice p.name {
	font-size: 230%;
	margin: 0 0 30px;
}

#content-voice p.name span {
	font-size: 60%;
	padding-left: 15px;
}

#content-voice p.profile-title {
	font-weight: bold;
	font-size: 120%;
	margin: 0 0 10px;
	}

#content-voice p.profile {
	font-size: 100%;
	margin: 0 0 5px;
}

/* --------------------------------------------------
	ニュースページ
-------------------------------------------------- */
ul.news-page {
	margin: 0 0 10px;
	border-top: 1px solid #555;
	}
	
ul.news-page li {
	list-style-type: none;
	line-height: 2.0;
	padding: 20px 0;
	border-bottom: 1px solid #555;
	}

ul.news-page li a {
	color: #555;
	height: 2.0;
	padding: 0;
	-webkit-text-size-adjust: none;
	}

ul.news-page li a:hover {
	color: #888;
	}

ul.news-page li span {
	float: left;
	line-height: 2.0;
	color: #555;
	font-size: 90%;
	-webkit-text-size-adjust: none;
	margin: 1px 30px 0 0;
	letter-spacing: 1px;
	}
	
/* --------------------------------------------------
	トップお知らせ
-------------------------------------------------- */
#section-news {
	width: 90%;
	max-width: 980px;
	clear: both;
	margin: 20px auto 0;
	padding: 0;
	}

.newstitle {
	float: left;
	width: 22%;
	padding: 0 5% 0 0;
	margin: 0 0 10px 0;
	text-align:center;
	}

.newstitle img {
	width: 100%;
	height: auto;
	margin: 18% 0 0;
	padding: 0;
	vertical-align: middle
}
	
.newslist {
	float: right;
	width: 73%;
	padding: 0;
	margin: 0 0 10px;
	}

ul.news {
	margin: 0 0 10px;
	padding-left: 40px;
	border-left: 1px dotted #555;
	}
	
ul.news li {
	list-style-type: none;
	line-height: 2.0;
	}

ul.news li a {
	color: #555;
	height: 2.0;
	padding: 0;
	-webkit-text-size-adjust: none;
	}

ul.news li a:hover {
	color: #888;
	}

ul.news li span {
	float: left;
	line-height: 2.0;
	color: #555;
	font-size: 90%;
	-webkit-text-size-adjust: none;
	margin: 1px 30px 0 0;
	letter-spacing: 1px;
	}
	
/* --------------------------------------------------
	ページ送り
-------------------------------------------------- */
p.pagenation {
	font-size: 10px;
	overflow: hidden;
	}

span.oldpage {
	float: left;
	}

span.newpage {
	float: right;
	}

/* --------------------------------------------------
	dt
-------------------------------------------------- */
.box-dt {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0 auto 0px;
	padding: 0 0 50px;
	}

.box-dt-second {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0 auto 0px;
	padding: 0 0 20px;
	border-top: 1px solid #ccc;
	background-image: url(image/dt-mat04.jpg);
	background-repeat: no-repeat;
	background-position: top right;
	background-size: 100%;
	}

.box-dt-second .text {
	display: block;
	padding: 5% 0 0 0;
	width: 60%;
	height: auto;
	}

p.subcopy {
	margin: 0 0 30px;
	padding: 0;
	font-weight: bold;
	font-size: 150%;
}

.box-dt-last {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0 auto 0px;
	padding: 50px 0 0;
	}
		
.dt-left {
	float: left;
	width: 35%;
	height: auto;
	margin: 0;
	padding: 0;
	overflow: hidden;
	}

.dt-right {
	float: right;
	width: 60%;
	height: auto;
	margin: 0;
	padding: 0;
	overflow: hidden;
	}

.dt-left img,.dt-right img {
	margin: 0 auto;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}

.dt-left30 {
	float: left;
	width: 31%;
	height: auto;
	margin: 0;
	padding: 0;
	overflow: hidden;
	}

.dt-left30 .image {
	width: 90%;
	height: auto;
	margin: 0 auto 50px;
	padding: 0;
	overflow: hidden;
	}
	
.dt-right70 {
	float: right;
	width: 65%;
	height: auto;
	margin: 0;
	padding: 0;
	overflow: hidden;
	}

.dt-left img,.dt-right img {
	margin: 0 auto;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}

p.ng {
	text-align: center;
	clear: both;
	line-height: 90px;
	height: 90px;
	margin: 30px auto 0px;
	padding: 0;
	background-image: url(image/howto-ng.png);
	background-repeat: no-repeat;
	background-position: top center;
	background-size: 90px;
	font-size: 200%;
	font-weight: bold;
	color: #384679 !important;
	}
	
p.caution {
	clear: both;
	height: auto;
	margin: 30px auto 0px;
	padding: 0 0 0 65px;
	background-image: url(image/caution.png);
	background-repeat: no-repeat;
	background-position: top left;
	background-size: 50px;
	font-size: 100%;
	}
	
/* --------------------------------------------------
	課題
-------------------------------------------------- */
.box-kadai {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0 auto 50px;
	padding: 0 0 50px;
	border-bottom: 1px solid #555;
	}
	
.kadai-left {
	float: left;
	width: 37%;
	height: auto;
	margin: 0;
	padding: 0 7% 0 0;
	overflow: hidden;
	border-right: 1px solid #555;
	}

.kadai-right {
	float: right;
	width: 48%;
	height: auto;
	margin: 0;
	padding: 0;
	overflow: hidden;
	}

.kadai-left img,.kadai-right img {
	margin: 0 auto;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}

.kadai-all {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0 0 50px;
	padding: 0;
	overflow: hidden;
	}

.kadai-all img {
	margin: 0 auto;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}

p.kadaititle {
	font-size: 150%;
	font-weight: bold;
	margin: 0 0 20px;
	padding: 0;
	color: #798bc3;
}

p.comments {
	font-size: 90%;
	text-align: center;
}

h2.orange {
	text-align: center;
	color: #dd9731;
}

/* --------------------------------------------------
	お客様の声
-------------------------------------------------- */
.koe {
	width: 100%;
	height: auto;
	margin: 0 auto 30px;
	padding: 0;
	}

.koe-inner {
	padding: 20px;
	border: 1px solid #555;
	}
	
.koe h3.user {
	font-size: 150%;
	line-height: 1.3;
	margin: 0 0 15px;
}

.koe-image {
	float: left;
	width: 18%;
	height: auto;
	margin: 0;
	padding: 0;
	overflow: hidden;
	}

.koe-text {
	float: right;
	width: 79%;
	height: auto;
	margin: 0;
	padding: 0;
	overflow: hidden;
	}

.koe-text p {
	margin: 0;
	line-height: 1.6;
	}
	
.koe-image img {
	margin: 0 auto;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}
	
/* --------------------------------------------------
	横2並び
-------------------------------------------------- */
.box2 {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0 auto 30px;
	padding: 0;
	}
	
.box2-left {
	float: left;
	width: 47%;
	height: auto;
	margin: 0 0 13px;
	padding: 0;
	overflow: hidden;
	}

.box2-right {
	float: right;
	width: 47%;
	height: auto;
	margin: 0 0 13px;
	padding: 0;
	overflow: hidden;
	}

.box2-left img,.box2-right img {
	margin: 0 auto 10px;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}
		
.box3 {
	width: 100%;
	height: auto;
	margin: 50px auto 0;
}

.box3-1,.box3-2 {
	float: left;
	width: 30%;
	height: auto;
	margin: 0 0 20px;
	margin-right: 5%;
}

.box3-3 {
	float: right;
	width: 30%;
	height: auto;
	margin: 0 0 20px;
	margin-right: 0;
}

.box3image {
	width: 100%;
	height: auto;
	margin: 0 0 15px;
	overflow: hidden;
}

.box3image img {
	width: 100%;
	height: auto;
	vertical-align: middle;
	position: relative;
}

.box3-1 p,.box3-2 p,.box3-3 p {
	font-size: 100%;
	text-align: center;
	line-height: 1.3;
	margin: 0;
}

#section-box4 {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0 0 30px;
	padding: 0;
	}

.box4 {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0 0 30px;
	padding: 0;
	}
	
.box4-1,.box4-2,.box4-3 {
	float: left;
	width: 23%;
	height: auto;
	margin: 0;
	margin-right: 2.66%;
}

.box4-4 {
	float: right;
	width: 23%;
	height: auto;
	margin: 0;
	margin-right: 0;
}

.box4image {
	width: 100%;
	height: auto;
	margin: 0 0 15px;
	overflow: hidden;
}

.box4image img {
	width: 100%;
	height: auto;
	vertical-align: middle;
	position: relative;
}

h5.link {
	height: 15px;
	line-height: 15px;
	margin: 0 0 30px;
	padding: 0;
}

h5.link a {
}

h5.link a i {
	color: #89c3eb;
}

#section-bnr {
	width: 47%;
	float: left;
	margin: 0;
	padding: 0;
	}

.bnr {
	width: 100%;
	height: auto;
	margin: 0 0 15px;
	overflow: hidden;
}

.bnr img {
	width: 100%;
	height: auto;
	vertical-align: middle;
}

/* --------------------------------------------------
	パンくずリスト
-------------------------------------------------- */
#breadcrumb  {
	margin-bottom: 5px;
	font-size: 85%;
	}

#breadcrumb div {
	display: inline;
	}

/* --------------------------------------------------
	ページ番号リンク
-------------------------------------------------- */
p.pagenum {
	text-align: center;
	}

p.pagenum a, p.pagenum span {
	color: #fff;
	border-radius: 3px;
	padding: 5px 7px;
	}

p.pagenum a {
	background-color: #555;
	}

p.pagenum a:hover {
	background-color: #ccc;
	color: #555;
	}

p.pagenum span  {
	background-color: #ccc;
	color: #555;
	}

#menuList {
	display: none;
}

table.data {
	clear: both;
	width: 100%;
	max-width: 978px;
	color: #555;
	margin: 0 auto 30px;
	padding: 0;
	border-collapse: collapse;
	}

tr {
	border-bottom: 1px solid #ccc;
	border-collapse: collapse;
	}

tr.last {
	border-bottom: none;
	border-collapse: collapse;
	}

td {
	border-collapse: collapse;
	}
			
table.data a {
	color: #444;
	border-bottom: 1px dotted #ccc;
	}
	
table.data td {
	line-height: 1.7;
	font-size: 100%;
	font-weight: normal;
	text-align: left;
	background-color: rgba(255,255,255,0.7); 
	padding: 20px 20px 16px;
	}

table.data td.category {
	border-right: 1px solid #ccc;
	padding-left: 0;
	padding-right: 5px;
	}


table.dt {
	clear: both;
	width: 100%;
	color: #555;
	margin: 15px auto 30px;
	padding: 0;
	border-collapse: collapse;
	border-top: 1px dotted #ccc;
	}
			
table.dt a {
	color: #555;
	border-bottom: 1px dotted #ccc;
	}
	
table.dt td {
	line-height: 1.7;
	font-size: 100%;
	font-weight: normal;
	text-align: left;
	background-color: rgba(255,255,255,0.7); 
	padding: 5px 20px 4px;
	}

table.dt td.category {
	border-right: 1px solid #ccc;
	padding-left: 0;
	padding-right: 5px;
	text-align: center;
	}

/* --------------------------------------------------
	リンク
-------------------------------------------------- */
.link-btn {
	margin: 0 auto 30px;
	width: auto;
	text-align: center;
	}

.link-btn a {
	display: inline-block;
	position: relative;
	background-color:#555;
	color: #fff !important;
	text-decoration: none !important;
	padding: 5px 20px;
	text-align: center;
	font-size: 95%;
	margin: 0 auto;
	cursor: pointer;
	min-width: 120px;
	}

p.link-btn-top {
	display: block;
	background-color:#555;
	color: #fff !important;
	text-decoration: none !important;
	padding: 5px 20px;
	text-align: center !important;
	font-size: 95% !important;
	margin: 0 auto;
	cursor: pointer;
	width: 120px;
	}
	
td.price {
	color: #FE76AA;
	font-size: 160% !important;
	text-align: right !important;
}

td.price span {
	font-size: 80% !important;
	text-align: right !important;
}

.breadcrumbs {
	margin: 0 auto;
	padding: 0 5% 5px;
	font-size: 90%;
}

div.qa {
	margin: 0 0 30px;
	height: auto;
	border-bottom: 1px dotted #aaa;
	}
	
div.question a {
	cursor:pointer;
	font-weight: 600;
	font-size: 130%;
	line-height: 1.3;
	width: auto;
	min-height: 40px;
	display: block;
	margin: 0;
	padding: 12px 0 0px 60px;
	background-image: url(image/q-mark.png);
	background-repeat: no-repeat;
	background-position: top left;
	text-decoration: none;
	color: #798bc3;
	overflow: hidden;
	}
	
div.question a:hover {
	opacity: 1.0;
	text-decoration: underline;
	}

div.answer {
	display: block;
	height: auto;
	margin: 0;
	padding: 0 0 20px 60px;
	background-image: url(image/a-mark.png);
	background-repeat: no-repeat;
	background-position: top left;
	}

div.answer p {
	display: block;
	height: auto;
	margin: 0;
	padding: 0 0 30px;
	}

.mark {
	position: absolute;
	top: -7px;
	right: 0;
	padding-right: 9%;
}

#firstimg {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	display: block;
}

div#loader {
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #fff;
  text-align: center;
  position: fixed;
  z-index: 99999999999999999999999999 !important;
  top: 0;
  left: 0;
}

div#loader span {
  width: 320px;
  margin-left: -160px;
  margin-top: -23px;
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
}

div#loader span img {
	width: 100%;
	height: auto;
	vertical-align: middle;
	position: relative;
}

/* --------------------------------------------------
	MAT300J
-------------------------------------------------- */
#content-mat300j {
	width: 100%;
	margin: 0 auto;
	padding: 80px 0 0%;
	background-image: url(image/mat300j/mat300j-back.png);
	background-size: 100%;
	background-position: top;
	background-repeat: no-repeat;
	}

.box-mat300j-01,.box-mat300j-02,.box-mat300j-03 {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0 auto 30px;
	padding: 0;
	}
	
.box-mat300j-01 .box-mat300j-text {
	float: left;
	width: 70%;
	height: auto;
	margin: 0;
	padding: 0;
	overflow: hidden;
	}

.box-mat300j-01 .box-mat300j-image {
	float: right;
	width: 27%;
	height: auto;
	margin: 0 0 0px;
	padding: 0;
	overflow: hidden;
	}

.box-mat300j-02 .box-mat300j-text {
	float: right;
	width: 40%;
	height: auto;
	margin: 0;
	padding: 0;
	overflow: hidden;
	}

.box-mat300j-02 .box-mat300j-image {
	float: left;
	width: 55%;
	height: auto;
	margin: 0 0 0px;
	padding: 0;
	overflow: hidden;
	}

.box-mat300j-03 .box-mat300j-text {
	float: left;
	width: 50%;
	height: auto;
	margin: 0;
	padding: 0;
	overflow: hidden;
	}

.box-mat300j-03 .box-mat300j-image {
	float: right;
	width: 45%;
	height: auto;
	margin: 0 0 0px;
	padding: 0;
	overflow: hidden;
	}

 #content-mat300j h2 {
	color: #e84a7e;
	}

 .box-mat300j-text p {
	margin: 0 0 20px;
	}

 .box-mat300j-image img {
	margin: 0 auto 10px;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}

section.mat300j-item {
	clear: both;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 50px 0;
	border-top: 1px solid #ccc;
	}

.box-mat300j-left {
	float: left;
	width: 48%;
	height: auto;
	margin: 0 0 20px;
	padding: 0;
	overflow: hidden;
	}

.box-mat300j-right {
	float: right;
	width: 48%;
	height: auto;
	margin: 0 0 20px;
	padding: 0;
	overflow: hidden;
	}

 #content-mat300j section.mat300j-item h2 {
	color: #555;
	 font-size: 300%;
	 line-height: 1.4;
	 margin: 0 0 15px;
	}

section.mat300j-item .box-mat300j-text h3 {
	 margin: 0 0 30px;
	}

section.mat300j-item .box-mat300j-text {
	float: left;
	width: 54%;
	height: auto;
	margin: 0;
	padding: 0;
	overflow: hidden;
	}

section.mat300j-item .box-mat300j-image {
	float: right;
	width: 42%;
	height: auto;
	margin: 0 0 20px;
	padding: 0;
	overflow: hidden;
	}

.box-mat300j-title {
	width: 130px;
	height: auto;
	margin: 0 auto 30px;
	padding: 0;
	overflow: hidden;
	}

.box-mat300j-title img,.box-mat300j-left img,.box-mat300j-right img {
	margin: 0 auto 10px;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}

.price {
	color: #e84a7e;
	font-size: 280%;
	line-height: 1.3;
	margin: 0;
	padding: 30px 0 0;
	}

.price span {
	color: #e84a7e;
	font-size: 70%;
	}

.image-kochira {
	margin: 0 0 10px;
	width: 100%;
	max-width: 280px;
	height: auto;
	vertical-align: middle;
	}

.image-kochira img {
	margin: 0 auto 10px;
	width: 100%;
	height: auto;
	vertical-align: middle;
	}

.kounyu-link {
	float: left;
	width: 100%;
	max-width: 280px;
	margin: 0 15px 0 0;
	text-align: center;
	background-color: #fff;
	}

.kounyu-link a {
	display: inline-block;
	position: relative;
	background-color:#e84a7e;
	color: #fff !important;
	text-decoration: none !important;
	padding: 20px 0;
	text-align: center;
	font-size: 130%;
	margin: 0 auto;
	cursor: pointer;
	width: 100%;
	}

.dt-link-box-mat300j {
	max-width: 600px;
	margin: 0px auto 50px;
}

.dt-link-box-mat300j .dt-link a {
	padding: 20px 0;
	}

.dt-link-box-mat300j .dt-link a:hover {
	opacity: 1.0;
	background-color: #e84a7e;
	}