@charset "UTF-8";
/* CSS Document */
@media screen and (max-width: 1380px) {
#contact {
background-size:auto 100%;
}
}
@media screen and (max-width: 1200px) {
/* ---------- header ----------*/
#gn_logo {
 width:198px;
}
h2 {
 padding:15px 0 5px 0;
 margin:40% auto 0 auto;
 line-height:65px;
 font-size:1.8rem;
}
/* ---------- About ----------*/
#About_text_wrap {
	width:900px;
}
#About_text_left_wrap {
	width:500px;
}
#About_text_left {
	width:470px;
	padding-top:0;
}
#answer_contents {
 width:95%;
}
.answer_contents_wrap {
 width:95%;
 padding:0 0 40px 0;
}
.answer_img_left {
 width:45%;
}
.answer_img_right {
 width:45%;
}
/* ---------- About画像のホバーエフェクト ----------*/
.view {
 width: 45%;
 height:100%;
 margin: 10px auto 30px auto;
}
.view .mask, .view .mask2, .view .content {
 width:100%;
 height: 100%;
}
.view .mask_title {
 font-size: 20px;
 padding: 8px;
}
#mask_span {
 line-height:30px;
 margin:0 auto;
 padding:10px 0 0 70px;
}
.view .mask2_title {
 font-size: 20px;
 padding: 8px;
}
.view p {
 font-size: 14px;
 line-height:30px;
 padding: 10px 20px 20px 20px;
}
}
 @media screen and (max-width: 1000px) {
/* ---------- header ----------*/
#top_text {
 font-size:1.3rem;
 line-height:40px;
}
/* ---------- about ----------*/
#qa {
 background-image:none;
}
#About_wrap {
	background-size:auto 900px;
	background-position:top;
}
#About_text_wrap {
 width:100%;
 margin:0 auto;
 text-align:center;
 padding:0;
}
#About_text_left_wrap {
 width:100%;
 float:none;
 padding:20px 0;
 border-top:#FFF solid 1px;
 border-bottom:#ddd solid 1px;
}
#About_text_left {
 margin:0 auto;
}
#About_text_right_wrap {
 width:100%;
 float:none;
 padding:10px 0 15px 0;
 border-bottom:#FFF solid 1px;
}
#About_text_right {
 margin:0 auto;
}
#kizuku {
 margin:25px auto 22px auto;
}
/* ---------- About画像のホバーエフェクト ----------*/
#mask_span {
 line-height:24px;
 padding:10px 0 0 50px;
}
}
@media screen and (max-width: 900px) {
/* ---------- about ----------*/
.answer {
 margin:20px 10px;
}
.answer_text_wrap {
 background-color:rgba(0, 0, 0, 0.1);
 width:90%;
 min-width:550px;
 padding:1px 5px;
 margin:0 auto;
}
.answer_contents_wrap {
 padding:0 0 30px 0;
}
.answer_img_left {
 width:100%;
 float:none;
 margin:30px auto 15px auto!important;
}
.answer_img_right {
 width:100%;
 float:none;
 margin:30px auto 15px auto!important;
}
.mask_title_smart {
 font-weight:900;
 font-size:16px;
}
.mask_title_smart, .mask_span_smart {
 display:block;
 width:550px;
 margin:0 auto;
 text-align:left;
}
#mietekuru {
 margin:10px auto 30px auto;
}
/* ---------- Contact ----------*/
#page-top img {
 width:65px;
}
/* ---------- About画像のホバーエフェクト ----------*/
.view {
 width: 550px;
 height: 100%;
 margin: 10px 10px 30px 10px;
 position:relative;
 display:block;
 color:#666;
 pointer-events: none;
}
.view .mask, .view .mask2, .view .content {
 display:block;
 width: 550px;
 height: 0;
 pointer-events: none;
}
.view .mask_title {
 font-size: 20px;
 padding: 8px;
 pointer-events: none;
}
#mask_span {
line-height:25px;
padding:4% 0 0 17%;
pointer-events: none;
}
.view .mask2_title {
 font-size: 20px;
 padding: 8px;
 pointer-events: none;
}
.view p {
 position:relative;
 display:block;
 font-size: 14px;
 line-height:30px;
 pointer-events: none;
 color:#666;
}
.view .mask, .view .mask2, .view .content {
pointer-events: none;
}
.view-first:after {
content:""!important;
 position:absolute!important;
 top:0!important;
 left:0!important;
 width:100%!important;
 height:100%!important;
 background:rgba(0, 0, 0, 0)!important;
 z-index:99!important;
}
.view-first img {
pointer-events: none;
transition-duration:0s;
}
.view-first .mask {
pointer-events: none;
-ms-transition:0;/*IE*/
 transition:0;
}
.view-first .mask2 {
pointer-events: none;
-ms-transition:0;/*IE*/
 transition:0;
}
.view-first .mask_title, .view-first .mask2_title {
pointer-events: none;
 -webkit-transform: translateY(0px);
 -moz-transform: translateY(0px);
 -o-transform: translateY(0px);
 -ms-transform: translateY(0px);
 transform: translateY(0px);
}
.view-first p {
pointer-events: none;
-webkit-transform: translateY(0px);
 -moz-transform: translateY(0px);
 -o-transform: translateY(0px);
 -ms-transform: translateY(0px);
 transform: translateY(0px);
}
.view-first:hover img {
pointer-events: none;
-webkit-transform: scale(1);/*IEホバー時拡大への対応*/
 -moz-transform: scale(1);/*IEホバー時拡大への対応*/
 -o-transform: scale(1);/*IEホバー時拡大への対応*/
 -ms-transform: scale(1);/*IEホバー時拡大への対応*/
 transform: scale(1);/*IEホバー時拡大への対応*/
}
.view-first a.info {
pointer-events: none;
-ms-transition:0;/*IE*/
 transition:0;
}
.view-first:hover .mask, .view-first:hover .mask2 {
pointer-events: none;
-ms-transition:0;/*IE*/
 transition:0;
}
.view-first:hover .mask_title, .view-first:hover .mask2_title, .view-first:hover p, .view-first:hover a.info {
pointer-events: none;
-webkit-transform:0;
 -moz-transform:0;
 -o-transform:0;
 -ms-transform:0;
 transform:0;
}
.view-first:hover p {
pointer-events: none;
-ms-transition:0;/*IE*/
 transition:0;
}
}
