@charset "utf-8";
/* ------------------------------------------------------------  common*/

h3 { font-size: 42px; text-align: center; letter-spacing: 3px;}
h3 span { display: block; font-size: 16px; line-height: 130%; letter-spacing: 0;}


/* ------------------------------------------------------------  */
#firstview { background: url(../images/index/fv_01.jpg?170907) center center no-repeat; text-align: center; background-size: cover; padding: 160px 0 170px;}

#nav { padding: 20px 0 25px;}
#nav ul { text-align: center; }
#nav ul li { display: inline-block; *display: inline; *zoom: 1; text-align: center;}
#nav ul li a { display: inline-block; *display: inline; *zoom: 1; border-right: 1px solid #e0e0e0; box-sizing: border-box; -webkit-box-sizing: border-box; width: 182px; padding: 5px 0;}
#nav ul li:first-child a { border-left: 1px solid #e0e0e0;}

#live { background: url(../images/index/intoro.jpg) center center no-repeat; background-size: cover; text-align: center; padding: 100px 0 100px;}
#live img { padding: 80px 0 0; }
#live p { font-size: 18px; line-height: 47px; padding: 40px 0 80px; color: #fff;}
#live .live_bg { background: url(../images/index/bg_01.png) no-repeat center center; }


#info { background: #000; background-size: cover; text-align: center; padding: 100px 0 80px; color: #fff;}
#info h3 { padding: 0 0 60px;}
#info ul { margin: 0 0 0 -11px;}
#info ul li { float: left; width: 359px; margin: 0 0 10px 11px; height: 471px; }
#info ul li div { padding: 20px 0; }
#info ul li div h4 { font-size: 23px; padding: 15px 0 10px; height: 60px; border-bottom: 1px solid #fff; line-height: 150%; }
#info ul li div p { text-align: left; padding: 15px 0;}

#gallery { padding: 100px 0 0;}
#gallery h3 { padding: 0 0 75px;}
#gallery .bg { background: #000; padding: 0 0 100px; }
#gallery .tech_01 .left { width: 50%; height: 716px; background: url(../images/index/img_00.jpg) no-repeat center center; background-size: cover; float: left; }
#gallery .tech_01 .left img { padding: 600px 0 0 5%; }
#gallery .tech_01 .text_top { width: 50%; height: 358px; background: url(../images/index/img_02.jpg) no-repeat center center; background-size: cover; float: left; }
#gallery .tech_01 .text_top p { padding: 320px 0 0; color: #fff; font-size: 20px; text-align: center; }
#gallery .tech_01 .text_bottom { width: 50%; height: 358px; background: url(../images/index/img_03.jpg) no-repeat center center; background-size: cover; float: left; }
#gallery .tech_01 .text_bottom p { padding: 320px 0 0; color: #fff; font-size: 20px; text-align: center; }
#gallery .pick { background: #000; padding: 85px 0 0; }
#gallery .pick div { float: left; }
#gallery .pick p { color: #fff; text-align: center; padding: 10px 0 40px; }
#gallery .pick img.center { margin: 0 40px; }
#gallery .oasis { background: url(../images/index/product_13.jpg) no-repeat center center; background-size: cover; height: 746px; text-align: center; }
#gallery .oasis div { width: 1100px; margin: 0 auto; }
#gallery .oasis div img { padding: 550px 0 0; }
#gallery .pick img.right { margin: 0 0 0 40px; }


#access { padding: 90px 0 100px;}
#access h3 { padding: 0 0 45px;}
#access .gmap iframe { width: 100%; height: 570px; box-sizing: border-box; -webkit-box-sizing: border-box; pointer-events: none; }
#access .gmap p { text-align: center; padding: 5px 0 0;}
#access .gmap p img { padding: 0 5px 0 0;}
#access .gmap p a { text-decoration: underline; font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif; color: #231815; }


#property_list { background: #100909; color: #fff; padding: 95px 0 65px;}
#property_list h3 { padding: 0 0 50px;}
#property_list ul li { text-align: center; }
#property_list ul li div { padding: 15px 0;}
#property_list ul li div h4 { padding: 0 0 10px;}
#property_list ul li div p.btn { padding: 10px 0 0;}
#property_list ul li div p.btn a { width: 220px; height: 30px; line-height: 30px; background: #c01125; font-size: 14px;}
#property_list ul.big { margin: 0 0 0 -40px; }
#property_list ul.big li { width: 530px; float: left; margin: 0 0 20px 40px;}
#property_list ul.big li.big { position: relative; }
#property_list ul.big li img.bn { position: absolute; top: 0; left: 0; }
#property_list ul.small { margin: 0 0 0 -17px;}
#property_list ul.small li { float: left; width: 355px; margin: 0 0 20px 17px; }
#property_list ul.small li div p.btn.yet { width: 220px; background: #c01125; font-size: 14px; height: auto; padding: 3px 0; margin: 10px auto 0; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;}
#property_list ul.small li h4 { font-size: 28px; line-height: 120%; }
#property_list ul.small li h4.dup { background: url(../images/index/logo_dup.png) no-repeat left top; padding: 0 0 13px 45px; line-height: 51px; text-align: center; display: inline-block; *display: inline; *zoom: 1; }
#property_list ul.small li h4 span { font-size: 14px; }
#property_list ul.small li h4 small { font-size: 14px; }

#property_list ul.small li.left { margin: 0 0 0 204px; }


#property_list h4 { text-align: center; font-size: 28px; padding: 40px 0 30px; }
#property_list ul.sells li { width: 500px; float: left; font-size: 15px; padding: 9px 20px; background: #fff; color: #000; text-align: left; }
#property_list ul.sells li.bgcolor { background: #ede9e4; }
#property_list ul.sells li a { text-align: right; display: block; float: right; font-size: 14px; color: #fff; background: #c01125 ; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; padding: 3px 20px; }
#property_list ul.sells li span { font-size: 12px; }
#property_list ul.sells li.cfx p { float: left; width: 76%; }
#property_list ul.sells li.cfx a { float: right; }



#menber { background: url(../images/index/bg_bb.png) no-repeat center center; background-size: cover; padding: 90px 0 70px; }
#menber p.noteice { padding: 40px 0 20px; text-align: center; }
#menber .back { background: #ebe6df; }
#menber h4 { color: #fff; font-size: 28px; line-height: 75px; background: #b9a788; text-align: center; }
#menber ul { padding: 20px 0; text-align: center; }
#menber li { background: #fff; width: 290px; float: left; height: 215px; padding: 0 25px; }
#menber li.center { margin: 0 10px; }
#menber li:first-child { margin: 0 0 0 30px; }
#menber li h5 { font-size: 24px; color: #bdae7a; line-height: 60px; border-top: 1px #bdae7a dotted; border-bottom: 1px #bdae7a dotted; margin: 20px 0 0; }
#menber li p { font-size: 15px; margin: 20px 0 0; text-align: left; }
#menber p.btn { background: #a11424; width: 490px; margin: 30px auto 0;  border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; }
#menber .btn a { font-size: 28px; line-height: 200%; padding: 12px 0; }


#contact { padding: 80px 0 110px;}
#contact h3 { font-size: 31px; padding: 0 0 35px;}
#contact .container { width: 890px; margin: 0 auto; background: url(../images/index/bg_05.gif); padding: 10px;}
#contact .container .bg { background: #fff; padding: 55px 40px 70px;}
#contact .container .bg h4 { font-size: 31px; padding: 0 0 45px; text-align: center;}
#contact .container .bg .line { padding: 0 0 25px;}
#contact .container .bg .line img.qrcode { float: left; width: 234px;}
#contact .container .bg .line div { float: right; width: 570px; padding: 20px 0 0; font-family: 'Lato', "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", 'メイリオ' , Meiryo , Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif, sans-serif; }
#contact .container .bg .line div h5 { font-size: 20px; font-weight: bold; padding: 5px 0;}
#contact .container .bg .line div h5 img { display: block; padding: 0 0 5px;}
#contact .container .bg .line div p { font-size: 14px;}
#contact .container .bg .line div p.id { background: #e9e9e9; text-align: center; font-size: 20px; margin: 25px 0 0;}
#contact .container .contact_box { border-top: 1px solid #e9e9e9; padding: 60px 0 0; margin: 0 0 0 20px;}
#contact .container .contact_box p.tel { width: 350px; padding: 0 40px 0 0; float: left; line-height: 130%;}
#contact .container .contact_box p.tel a { font-family: times; font-size: 50px; line-height: 130%; display: block;}
#contact .container .contact_box p.tel img { vertical-align: top; padding: 20px 15px 0 0; }
#contact .container .contact_box p.tel span { display: block;}
#contact .container .contact_box p.btn { width: 400px; float: right; }
#contact .container .contact_box p.btn a { width: 400px; height: 60px; line-height: 60px; background: #e3b035; letter-spacing: 2px;}
#contact .container .contact_box p.btn a img { padding: 0 15px 0 0;}


/* ------------------------------------------------------------ mobile */
@media only screen and (max-width:640px){

/* ------------------------------------------------------------  common*/

h3 { font-size: 24px; text-align: center; letter-spacing: 1px;}
h3 span { display: block; font-size: 14px; line-height: 160%; letter-spacing: 0; padding: 5px 0 0;}


/* ------------------------------------------------------------  */

#firstview { background: url(../images/index/fv_01.jpg?170907) center center no-repeat; text-align: center; background-size: cover; padding: 80px 0;}
#firstview h2 img { width: 200px; height: auto;}

#live { background: url(../images/index/intoro.jpg) center top no-repeat; background-size: cover; text-align: center; padding: 50px 0 100px;}
#live h3 img { width: 90%; height: auto;}
#live p { font-size: 13px; line-height: 30px; padding: 25px 3% 0; color: #fff;}
#live .live_bg { width: 94%; margin: 0 auto; }

#info { background: #000; background-size: cover; text-align: center; padding: 50px 0 40px; color: #fff;}
#info h3 { padding: 0 0 20px;}
#info ul { margin: 0;}
#info ul li { float: none; width: 100%; margin: 0 0 10px; height: auto; }
#info ul li img { width: 100%; height: auto;}
#info ul li div { padding: 15px 0;}
#info ul li div h4 { font-size: 18px; padding: 15px 0 10px; height: auto; border-bottom: 1px solid #fff; line-height: 130%; }
#info ul li:first-child div h4 { padding: 0 0 10px; height: auto;}
#info ul li div p { text-align: left; padding: 15px 0;} 

#gallery { padding: 50px 0 0;}
#gallery h3 { padding: 0 0 30px;}
#gallery .bg { padding: 0; }
#gallery .tech_01 .left { width: 100%; height: auto; background: none ; float: none; padding: 0; }
#gallery .tech_01 .left img { width: 100%; height: auto; margin: 0 auto; padding: 0; }
#gallery .tech_01 .text_top { width: 94%; height: auto; margin: 20px auto 0; float: none; padding:260px 0 0; }
#gallery .tech_01 p.font { font-size: 14px; color: #fff; text-align: center; }
#gallery .tech_01 .text_bottom { width: 94%; height: auto; margin: 20px auto 0; float: none; padding:260px 0 0; }
#gallery .tech_01 .text_bottom p { font-size: 14px; padding: 200px 0 0; }

#gallery .pick { padding: 50px 0 0; }
#gallery .pick div { float: none; padding: 0 0 30px; }
#gallery .pick img { width: 50%; height: auto; float: left; }
#gallery .pick p { color: #fff; padding: 25% 0 0 3%; float: right; font-size: 14px; width: 47%; margin: 0 ; line-height: 150%; text-align: center;}
#gallery .pick .spacer p { padding: 30% 0 0 3%; }
#gallery .pick img.center { margin: 0; }
#gallery .oasis { background: none; height: auto; padding: 30px 0 0; }
#gallery .oasis img { width: 100%; height: auto; }
#gallery .pick.up { padding: 3% 0 0; }
#gallery .pick.up div { float: none; padding: 0; }
#gallery .pick.up img { width: 100%; height: auto; float: none; }
#gallery .pick.up p { color: #fff; text-align: center; padding: 3% 0 20px; float: right; font-size: 14px; width: 100%; margin: 0 auto; line-height: 200%; }

#gallery .pick img.right { margin: 0; }


#access { padding: 45px 0;}
#access h3 { padding: 0 0 20px;}

#access .gmap { position: relative; padding-bottom: 300px; padding-top: 30px; height: 0;}
#access .gmap iframe,
#access .gmap object,
#access .gmap embed { position: absolute; top: 0; left: 0; width: 100%; height: 300px; }
#access .gmap iframe { box-sizing: border-box; -webkit-box-sizing: border-box;}
#access .gmap p { text-align: center; padding: 280px 0 0;}
#access .gmap p a { color: #000;}
#access .gmap p img { padding: 0 5px 0 0;}

#property_list { background: #100909; color: #fff; padding: 45px 0;}
#property_list h3 { padding: 0 0 20px;}
#property_list ul li { text-align: center; }
#property_list ul li div { padding: 15px 0;}
#property_list ul li div h4 { padding: 0 0 10px;}
#property_list ul li div h4 img { height: 40px; width: auto;}
#property_list ul li img.photo { width: 100%; height: auto;}
#property_list ul li div p.btn { padding: 10px 0 0;}
#property_list ul li div p.btn a { width: 220px; height: 30px; line-height: 30px; background: #c01125; font-size: 14px;}
#property_list ul.big { margin: 0;}
#property_list ul.big li { width: 100%; float: none; margin: 0 0 15px;}
#property_list ul.small { margin: 0;}
#property_list ul.small li { float: none; width: 100%; margin: 0 0 15px; padding: 15px 0 0;}
#property_list ul.small li div p.btn { text-align: center;}
#property_list ul.small li div p.yet { text-align: center;}
#property_list ul.small li div p.btn.yet { background: #c01125; font-size: 14px; height: auto; padding: 3px 0; margin: 10px auto 0; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;}
#property_list ul.small li h4 img.nanmei { height: 40px; }
#property_list ul.small li.left { margin: 0 0 15px; }

#property_list h4 { text-align: center; font-size: 20px; padding: 30px 0 20px; }
#property_list ul.sells li { width: 94%; float: none; font-size: 13px; padding: 9px 3%; background: #fff; color: #000; text-align: left; line-height: 40px;}
#property_list ul.sells li.bgcolor { background: #fff; }
#property_list ul.sells li.spcolor { background: #ede9e4; }

#property_list ul.sells li a { text-align: right; display: block; float: right; font-size: 12px; color: #fff; background: #c01125 ; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; padding: 5px 12px; margin: 5px 0 0; }
#property_list p.cation { font-size: 12px; color: #fff; }
#property_list ul.sells li.cfx p { float: left; width: 70%; }
#property_list ul.sells li.cfx a { float: right; }


#menber { padding: 40px 0 30px; }
#menber p.noteice { padding: 20px 0 10px; text-align: center; }
#menber h4 { color: #fff; font-size: 28px; line-height: 120%; padding: 10px 0; }
#menber li { width: 86%; margin: 0 auto; float: none; height: 200px; padding: 10px 4% 0; }
#menber li.center { margin: 10px auto; }
#menber li:first-child { margin: 0 auto; }
#menber li h5 { font-size: 22px; line-height: 60px; border-top: 1px #bdae7a dotted; border-bottom: 1px #bdae7a dotted; margin: 10px 0 0; }
#menber li p { font-size: 15px; margin: 20px 0 0; text-align: left; }
#menber p.btn { background: #a11424; width: 90%; margin: 30px auto 0;  border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; }
#menber .btn a { font-size: 24px; line-height: 200%; padding: 12px 0; }


#contact { padding: 40px 0;}
#contact h3 { font-size: 20px; padding: 0 0 20px;}
#contact .container { width: 90%; margin: 0 auto; background: url(../images/index/bg_05.gif); padding: 2%;}
#contact .container .bg { background: #fff; padding: 25px 3%;}
#contact .container .bg h4 { font-size: 18px; padding: 0; text-align: center;}
#contact .container .bg .line { padding: 0 0 15px; text-align: center;}
#contact .container .bg .line img.qrcode  { float: none; width: 180px; height: auto;}
#contact .container .bg .line div { float: none; width: 100%; padding: 0; font-family: 'Lato', "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", 'メイリオ' , Meiryo , Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif, sans-serif; }
#contact .container .bg .line div h5 { font-size: 16px; font-weight: bold; padding: 5px 0;}
#contact .container .bg .line div h5 img { display: block; padding: 0 0 5px; width: 100px; height: auto; margin: 0 auto;}
#contact .container .bg .line div p { font-size: 12px; text-align: left;}
#contact .container .bg .line div p.id { background: #e9e9e9; text-align: center; font-size: 15px; margin: 15px 0 0; padding: 10px 0;}
#contact .container .contact_box { border-top: 1px solid #e9e9e9; padding: 20px 0 0; margin: 0; text-align: center;}
#contact .container .contact_box p.tel { width: 100%; padding: 0; float: none;}
#contact .container .contact_box p.tel a { font-family: times; font-size: 34px; line-height: 130%;}
#contact .container .contact_box p.tel img { vertical-align: top; padding: 5px 15px 0 0; width: 20px auto;}
#contact .container .contact_box p.tel span { display: block;}
#contact .container .contact_box p.btn { width: 100%; float: none; padding: 15px 0 0;}
#contact .container .contact_box p.btn a { width: 100%; height: 40px; line-height: 40px; background: #e3b035; letter-spacing: 2px;}
#contact .container .contact_box p.btn a img { padding: 0 15px 0 0;}

}