@charset "UTF-8";

/*-------------------------
__grandir_style
-------------------------*/

/*共通----------#main*/

#main .sp_none{display: block;}
#main .pc_none{display: none;}
#main .sub_ttl{font-size: 26px;line-height: 1.2;letter-spacing: 0.14em;font-weight: 700;text-align: center;color: #3780bc;padding: 0 0 40px;}
#main .sub_ttl::before{content: "";display: block;width: 40px;height: 44px;background: url("images/sub_ttl_ic.png")no-repeat center center / contain;margin: auto auto 15px;}
@media only screen and (-webkit-min-device-pixel-ratio:2){
#main .sub_ttl::before{background: url("images/sub_ttl_ic@2x.png")no-repeat center center / contain;}
}
@media screen and (min-width:768px){
}
@media screen and (max-width:767px){
#main .sp_none{display: none;}
#main .pc_none{display: block;}
#main .sub_ttl{font-size: 20px;padding: 0 0 20px;}
#main .sub_ttl::before{margin: auto auto 5px;}
}

#main .page_nav{background: rgba(55,128,188,0.9);padding: 25px 0;box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.3);position: fixed;right: 0;top: 0;left: 0;z-index: 999;}
#main .page_nav ul{letter-spacing: -1em;text-align: center;}
#main .page_nav ul li{display: inline-block;box-sizing: border-box;}
#main .page_nav ul li + li{border-left: 1px solid #FFF;margin-left: 20px;padding-left: 20px;}
#main .page_nav ul li a{font-size: 20px;line-height: 1.2;letter-spacing: 0.1em;font-weight: 700;text-decoration: none;color: #FFF;}
@media screen and (max-width:1080px){
#main .page_nav ul li + li{margin-left: 20px;}
#main .page_nav ul li a{font-size: 18px;}
}
@media screen and (min-width:768px){
#main .page_nav ul li a{transition:.3s;}
#main .page_nav ul li a:hover{border-bottom: 1px solid #FFF;opacity: 0.7;}
}
@media screen and (max-width:767px){
#main .page_nav{padding: 10px 10px 5px;top: auto;bottom: 0;}
#main .page_nav ul{text-align: left;}
#main .page_nav ul li{width: calc(100% / 3);text-align: left;border-right: 1px solid #FFF;margin: 0 0 5px 0;padding: 0 0 0 10px;}
#main .page_nav ul li + li{border-left: none;margin-left: 0px;padding-left: 10px;}
#main .page_nav ul li:nth-child(3n){border-right: none;margin-right: 0;}
#main .page_nav ul li a{font-size:13px;}
}

/*ページタイトル----------#top_ttl*/

#top_ttl{width: 100%;height: 200px;background: url("images/page_ttl_bg.jpg")no-repeat center center / cover;margin: 0 0 70px;}
#top_ttl .page_ttl_box{display: inline-block;height:150px;color:#FFF;background-color: #3780c0;margin: 120px 0 0;padding: 30px 100px 40px;box-sizing: border-box;position: relative;}
#top_ttl .page_ttl_box::after{content: "";display: inline-block;width: 290px;height: 100px;background: url("images/page_ttl_img.png")no-repeat center center / contain;position: absolute;top: 0;left: 0;webkit-transform: translate(-50%, -40%);transform: translate(-50%, -40%);}
#top_ttl .page_ttl_box span{display: block;font-size: 20px;font-weight: 700;margin: 5px 0 0;}
@media only screen and (-webkit-min-device-pixel-ratio:2){
#top_ttl .page_ttl_box::after{background: url("images/page_ttl_img@2x.png")no-repeat center center / contain;}
}
@media screen and (min-width:768px){
}
@media screen and (max-width:767px){
#top_ttl{height: 120px;margin: 0 0 50px;padding: 0 20px;box-sizing: border-box;}
#top_ttl .page_ttl_box{width: 100%;height: auto;margin: 60px 0 0;padding: 15px 0;}
#top_ttl .page_ttl_box::after{width: 145px;height: 50px;left: 50px;}
#top_ttl .page_ttl_box img{max-width: 60%;height: auto;}
#top_ttl .page_ttl_box span{font-size: 16px;}
}

/*メイン写真----------#main_img_box*/

#main_img_box{background: url("../images/main_img_bg.jpg")no-repeat center center / cover;overflow: hidden;}
#main_img_box .property_ttl{display: flex;-ms-flex-item-align: center;align-self: center;text-align: left;white-space: nowrap;margin: 30px 0 0 calc((100% - 1000px)/2);padding: 40px 0 20px;position: relative;}
#main_img_box .property_ttl::before{content: "";display: block;width: 95px;height: 105px;background: url("images/property_ttl_bg.png")no-repeat center center / contain;position: absolute;top: 0;left: -20px;}
#main_img_box .property_ttl::after{content: "";display: block;width: 100%;height: 35px;background-size: auto auto;background-color: rgba(255, 255, 255, 0);background-image: repeating-linear-gradient(135deg, transparent, transparent 5px, rgba(55, 128, 188, 1) 5px, rgba(55, 128, 188, 1) 7px );opacity: 0.25;}
#main_img_box .property_ttl .txt{font-size: 25px;font-weight: 700;letter-spacing: 0.1em;color: #3780bc;padding: 0 45px 0 0;}
#main_img_box .property_ttl .txt img{vertical-align: middle;margin: 0 5px 0 0;}
#main_img_box .inner{max-width: 1000px;margin: auto;padding: 30px 40px 45px;}
#main_img_box p{font-size: 22px;line-height: 1.5;letter-spacing: 0.17em; font-weight: 700;text-align: left;padding: 0 0 30px;}
#main_img_box .main_img{position: relative;}
#main_img_box .main_img::before{content: "";display: block;width: 515px;height: 430px;background-color: #3780bc;position: absolute;bottom: -20px;left: -20px;opacity: 0.2;}
#main_img_box .main_img img{width: 100%;height: auto;vertical-align: top;position: relative;}
#main_img_box ul{letter-spacing: -1em;text-align: left;padding: 60px 0 0;}
#main_img_box ul.border{border-top:1px solid #333;padding: 30px 0 0;margin-top:10px;}
#main_img_box ul li{display: inline-block;width: calc((100% - 60px)/5);vertical-align:top;margin: 0 15px 15px 0;}
#main_img_box ul li:nth-child(5n){margin-right: 0;}
#main_img_box ul li a{display: block;height: 100px;letter-spacing: normal;overflow: hidden;position: relative;}
#main_img_box ul li a img{width: 100%;height: auto;position: absolute;top: 50%;left: 50%;-webkit-transform: translate(-50%,-50%);transform: translate(-50%,-50%);}
#main_img_box ul li p{font-size:13px;font-weight:normal;line-height:1.3;letter-spacing:normal;text-align:center;padding:10px 0 0;}
@media screen and (max-width:1080px){
#main_img_box .property_ttl{margin:30px 0 0 40px;}
}
@media screen and (min-width:768px){
#main_img_box ul li a img{transition:.3s;}
#main_img_box ul li a:hover img{opacity: 0.5;}
}
@media screen and (max-width:767px){
#main_img_box{}
#main_img_box .property_ttl{margin: 20px 0 0 20px;padding: 20px 0 0;}
#main_img_box .property_ttl::before{width: 60px;height: 66px;}
#main_img_box .property_ttl::after{}
#main_img_box .property_ttl .txt{font-size: 18px;padding: 0 20px 0 0;}
#main_img_box .property_ttl .txt img{width: auto;height: 30px;margin: 0;}
#main_img_box .inner{padding: 20px 20px 5px;}
#main_img_box p{font-size: 16px;line-height: 1.4;padding: 0 0 15px;}
#main_img_box .main_img::before{width: 120px;height: 100px;}
#main_img_box ul{letter-spacing: -1em;text-align: left;padding: 20px 0 0;}
#main_img_box ul li{width: calc((100% - 30px)/3);margin: 0 15px 15px 0;}
#main_img_box ul li:nth-child(5n){margin-right: 15px;}
#main_img_box ul li:nth-child(3n){margin-right: 0;}
#main_img_box ul li a{height:60px;}
#main_img_box ul li p{font-size:12px;line-height:1.1;padding:5px 0 0;}
}

/*施工例----------#example_box*/

#example_box{}
#example_box .inner{max-width: 1000px;margin: auto;padding: 60px 40px 45px;}
#example_box ul{letter-spacing: -1em;text-align: left;background-color: #EFEFEF;padding: 30px 30px 15px;box-sizing: border-box;}
#example_box ul li{display: inline-block;width: calc((100% - 60px)/5);letter-spacing: normal;margin: 0 15px 15px 0;}
#example_box ul li:nth-child(5n){margin-right: 0;}
#example_box ul li a{display: block;height: 100px;overflow: hidden;position: relative;}
#example_box ul li a img{width: 100%;height: auto;position: absolute;top: 50%;left: 50%;-webkit-transform: translate(-50%,-50%);transform: translate(-50%,-50%);}
#example_box ul li p{font-size:13px;font-weight:normal;line-height:1.3;text-align:center;padding:10px 0 0;}
@media screen and (min-width:768px){
#example_box ul li a img{transition:.3s;}
#example_box ul li a:hover img{opacity: 0.5;}
}
@media screen and (max-width:999px){
#example_box ul li img{height: 100%;width: auto;}
#example_box ul li.img_h img{width: 100%;height: auto;}
}
@media screen and (max-width:767px){
#example_box{margin:0 0 40px;}
#example_box .inner{padding: 40px 0 0;}
#example_box ul{padding: 20px 20px 5px;}
#example_box ul li{width: calc((100% - 30px)/3);}
#example_box ul li:nth-child(5n){margin-right: 15px;}
#example_box ul li:nth-child(3n){margin-right: 0;}
#example_box ul li a{height:60px;}
#example_box ul li a img{width: 100%;height: auto;}
#example_box ul li p{font-size:12px;line-height:1.1;padding:5px 0 0;}
}

/*間取・区画----------#plan_box*/

#plan_box{margin: -80px 0 0;padding:80px 0 0;}
#plan_box .inner{max-width: 1000px;margin: auto;padding: 40px 40px 80px;}
#plan_box .box{letter-spacing: 0.04em;}
#plan_box .box + .box{border-top: 1px solid #8b8b8b;margin-top: 30px;padding-top: 30px;}
#plan_box .box .box_ttl{text-align: left;margin:0 0 50px;display: flex;flex-wrap: wrap;align-items: flex-end;}
#plan_box .box .box_ttl strong,
#plan_box .box .box_ttl p.price{display: block;line-height: 1.2;font-weight: 700;border-bottom: 2px solid #3780bc;margin: 0 0 10px;padding: 0 0 8px;}
#plan_box .box .box_ttl strong {width: calc(100% - 200px);font-size: 25px;text-align: left;}
#plan_box .box .box_ttl p.price {width: 200px;font-size: 36px;color: #3780bc;text-align: right;}
#plan_box .box .box_ttl p.price span{font-size: 20px;color: #000;display: inline-block;position: relative;}
#plan_box .box .box_ttl p.price span>span.tax{font-size: 11px;transform: translateX(-50%);white-space: nowrap;position: absolute;top: -12px;left: 50%;}
#plan_box .box .box_ttl strong span{font-size: 20px;}
#plan_box .box .box_ttl strong br{display: none;}
#plan_box .box .box_ttl p{font-size: 14px;line-height: 1.4;}
#plan_box .box .img img{max-width: 650px;height: auto;vertical-align: top;}
#plan_box .box .box_txt{font-size: 15px;line-height: 1.5;letter-spacing: 0.04em;text-align: left;background-color: #dce6f1;margin: 10px;padding: 20px;box-sizing: border-box;position: relative;}
#plan_box .box .box_txt::before,
#plan_box .box .box_txt::after{content: "";display: block;width: 50px;height: 50px;box-sizing: border-box;position: absolute;}
#plan_box .box .box_txt::before{border-top: 5px solid #dce6f1;border-left: 5px solid #dce6f1;top: -10px;left: -10px;}
#plan_box .box .box_txt::after{border-right: 5px solid #dce6f1;border-bottom: 5px solid #dce6f1;right: -10px;bottom: -10px;}
#plan_box .box .box_txt .box_txt_ttl{display: block;font-size: 20px;line-height: 1.2;font-weight: 700;color: #3780bc;padding: 0 0 15px;}
#plan_box .box .box_txt .box_txt_ttl::after{content: "";display: block;width: 8.5em;height: 7px;background-size: auto auto;background-color: rgba(255, 255, 255, 0);background-image: repeating-linear-gradient(135deg, transparent, transparent 3px, rgba(55, 128, 188, 1) 3px, rgba(55, 128, 188, 1) 5px );opacity: 0.25;}
#plan_box .box .box_txt ul{}
#plan_box .box .box_txt ul li{position: relative;padding: 0 0 0 2em;}
#plan_box .box .box_txt ul li + li{margin-top: 10px;}
#plan_box .box .box_txt ul li .num{display: inline-block;line-height: 1em;text-align: center;vertical-align: middle;width: 1em;height: 1em; color: #FFF;background: #223A70;border-radius: 100px;margin: 0 5px 0 0;padding: 5px;position: absolute;top: -2px;left: 0;}
@media screen and (min-width:768px){
}
@media screen and (max-width:767px){
#plan_box .inner{padding: 20px 20px 40px;}
#plan_box .box + .box{margin-top: 20px;padding-top: 20px;}
#plan_box .box .box_ttl{margin: 0 0 20px;display: block;}
#plan_box .box .box_ttl strong{width: auto;font-size: 18px;line-height: 26px;border-bottom: none;margin: 0;padding-bottom: 5px;}
#plan_box .box .box_ttl strong span{font-size: 15px;}
#plan_box .box .box_ttl strong br{display: block;}
#plan_box .box .box_ttl p.price{width: auto;}
#plan_box .box .box_ttl p.price{font-size: 32px;}
#plan_box .box .box_ttl p.price span{font-size: 16px;}
#plan_box .box .box_ttl p.price span>span.tax{font-size: 10px;}
#plan_box .box .box_ttl p{font-size: 13px;}
#plan_box .box .img img{max-width: 100%;}
#plan_box .box .box_txt{margin: 30px 10px 10px}
}

/*動画----------#movie_box*/

#movie_box{overflow:hidden;margin: 0 0 60px; position: relative;}
#movie_box::before{content: "";display: block;width: calc(100% - ((100% - 1000px)/2 + 160px));height: 755px;background: url("images/movie_bg.jpg");position: absolute;top: 0;bottom: 0;left: 0;}
#movie_box .inner{max-width: 1000px;margin: auto;padding: 100px 40px 20px;overflow: hidden;}
#movie_box .inner .box{position: relative;}
#movie_box .inner .box + .box{margin-top: 80px;}
#movie_box .inner .box:nth-child(odd){float: right;}
#movie_box .inner .box:nth-child(odd)::before{content: "";display: block;width: 430px;height: 225px;background-size: auto auto;background-color: rgba(255, 255, 255, 0);background-image: repeating-linear-gradient(135deg, transparent, transparent 3px, rgba(55, 128, 188, 1) 3px, rgba(55, 128, 188, 1) 5px );position: absolute;top: -20px;left: -50px;opacity: 0.25;}
#movie_box .inner .box:nth-child(even){float: left;}
#movie_box .inner .box:nth-child(even)::before{content: "";display: block;width: 430px;height: 225px;background-size: auto auto;background-color: rgba(255, 255, 255, 0);background-image: repeating-linear-gradient(135deg, transparent, transparent 3px, rgba(55, 128, 188, 1) 3px, rgba(55, 128, 188, 1) 5px );position: absolute;top: -20px;right: -50px;opacity: 0.25;}
#movie_box .inner .box:nth-child(even)::after{content: "";display: block;width: 430px;height: 225px;background-color: #dce6f1;position: absolute;bottom: -20px;left: -50px;}
#movie_box .inner .box img{max-width: 100%;height: auto;position: relative;z-index: 99;}
.movie-wrap{max-width:900px;margin:auto;position:relative;}
.movie-wrap::before{content:"";display: block;padding-top:56.11%; /* 高さを幅の75%に固定 */}
.movie-wrap iframe{width:100%;height:100%;position:absolute;top:0;left:0;bottom:0;right:0;}
.mfp-close-btn-in .mfp-close{color:#FFF!important;margin:-40px 0 0;}
@media screen and (min-width:768px){
#movie_box .inner .box .img{cursor: pointer;}
#movie_box .inner .box .img img{transition:.3s;}
#movie_box .inner .box .img:hover img{opacity: 0.5;}
}
@media screen and (max-width:767px){
#movie_box{margin: 0 0 40px;}
#movie_box .inner{padding: 40px 20px 20px;}
#movie_box::befor{height: 65%;}
#movie_box .inner .box + .box{margin-top: 40px;}
#movie_box .inner .box:nth-child(odd)::before,
#movie_box .inner .box:nth-child(even)::before,
#movie_box .inner .box:nth-child(even)::after{width: 200px;height: 105px;}
}

/*設備仕様----------#equipment_box*/
#equipment_box{margin: -80px 0 0;padding: 80px 0 0;}
#equipment_box .inner{max-width: 1000px;margin: auto;padding: 0 40px 60px;}
#equipment_box .ico_list{}
#equipment_box .ico_list ul{display:flex;flex-wrap:wrap;justify-content:space-between;background-color: #EFEFEF;border-radius: 10px;padding: 20px 30px 15px;box-sizing: border-box;}
#equipment_box .ico_list ul li{width:calc((100% - 135px) / 10);}
#equipment_box .ico_list ul li img{width:100%;}
#equipment_box .spec_box{text-align: left;margin:50px auto 0;}
#equipment_box .spec_box dl{box-sizing:border-box;}
#equipment_box .spec_box dl dt .spec_title{font-size:18px;font-weight: 700;}
#equipment_box .spec_box dl dt .spec_title .mark{display: block;background-color:#3780bc;box-sizing: border-box;margin: 0 0 10px;padding:5px 10px;color:#FFF;}
#equipment_box .spec_box dl dd .img_box{display:block;margin-top:10px;}
#equipment_box .spec_box dl dd .img_box img{width:100%;vertical-align: top;}
#equipment_box .spec_box dl dd p{font-size:14px;line-height: 1.5;padding-top:10px;}
#equipment_box .spec_box .spec_box_wrap{display: flex;justify-content:space-between;margin: 0 0 40px;}
#equipment_box .spec_box .spec_box_wrap dl{width: calc((100% - 30px)/2);}
#equipment_box .spec_box .spec_box_wrap dl + dl{position: relative;}
#equipment_box .spec_box .spec_box_wrap dl + dl::before{content: "";display: block;width: 1px;height: 100%;background-color: #CCC;position:absolute;top: 0;bottom: 0;left: -15px;}
#equipment_box .spec_box .rows{display:flex;justify-content:space-between;border-top:1px solid #BCBCBC;padding: 20px 0 0;}
#equipment_box .spec_box .rows dl{margin-top:0;width:36%;border:none;}
#equipment_box .spec_box .rows dl:nth-of-type(2){width:22%;}
#equipment_box .spec_box .rows dl dt .spec_title{font-size:14px}
#equipment_box .spec_box .rows dl dt .spec_title .mark{margin-bottom:5px;}
@media screen and (max-width:767px){
#equipment_box .inner{padding: 0 20px 40px;}
#equipment_box .ico_list ul{padding: 20px;}
#equipment_box .ico_list ul li{width:calc(100% / 5);}
#equipment_box .spec_box{margin: 0 auto;}
#equipment_box .spec_box dl dt .spec_title{font-size: 14px;}
#equipment_box .spec_box dl dd p{font-size: 13px;}
#equipment_box .spec_box .spec_box_wrap{display: block;margin:0;}
#equipment_box .spec_box .spec_box_wrap dl{width: 100%;margin: 30px 0 0;}
#equipment_box .spec_box .spec_box_wrap dl + dl::before{content: none;}
#equipment_box .spec_box .rows{display: block;border-top: none;padding:0;}
#equipment_box .spec_box .rows dl,
#equipment_box .spec_box .rows dl:nth-of-type(2){width: 100%;}
#equipment_box .spec_box .rows dl{margin: 20px 0 0;}
#equipment_box .spec_box .rows dl dd p{padding:0;}
}

/*周辺環境----------#location_box*/

#location_box{margin: -80px 0 0;padding: 80px 0 0;}
#location_box .inner{padding: 0 40px;}
#location_box .location_list{max-width: 1000px;margin: auto;padding: 0 0 65px;}
#location_box .location_list ul{letter-spacing: -1em;}
#location_box .location_list ul li{display:inline-block;width:calc((100% - 45px)/4);letter-spacing: normal;text-align: left;vertical-align: top;margin: 0 15px 15px 0;}
#location_box .location_list ul li:nth-child(4n){margin-right: 0;}
#location_box .location_list ul li img{max-width: 100%;height: auto;vertical-align: top;}
#location_box .location_list ul li strong{display: block;font-size: 14px;text-align: left;font-weight: 700;color: #3780bc;margin: 10px 0 0;}
#location_box .location_list ul li p{font-size: 14px;line-height: 1.7;text-align: left;border: 1px solid #3780bc;margin: 5px 0 0;padding: 10px;box-sizing: border-box;}
@media screen and (max-width:767px){
#location_box .inner{padding: 0 20px;}
#location_box .location_list{padding: 0 0 25px;}
#location_box .location_list ul{}
#location_box .location_list ul li{width: calc((100% - 10px)/2);margin: 0 10px 15px 0;}
#location_box .location_list ul li:nth-child(2n){margin-right: 0;}
}

/*マップ----------#map_box*/

#map_box{margin: -80px 0 0;padding: 80px 0 0;}
#map_box .inner{max-width: 1000px;margin: auto;padding: 0 40px 80px;}
#map_box iframe{width: 100%;height: 445px;}
#map_box .img{max-width: 1000px;border: 1px solid #CCC;box-sizing: border-box;}
#map_box .img img{width: 100%;height: auto;vertical-align:top;}
@media screen and (min-width:768px){
}
@media screen and (max-width:767px){
#map_box{}
#map_box .inner{padding: 0 20px 40px;}
#map_box iframe{height: 250px;}
#map_box .img{}
}

/*路線図----------#route_box*/
#route_box{padding: 0 40px;}
#route_box .img{max-width: 1000px;border: 1px solid #CCC;box-sizing: border-box;margin: 40px auto 0;}
#route_box .img img{width: 100%;height: auto;}
@media screen and (min-width:768px){
}
@media screen and (max-width:767px){
#route_box{padding: 0 20px;}
#route_box .img{margin: 40px 0 0;}
}

/*ロケーションリスト----------#location_list_box*/

#location_list_box{max-width: 1000px;margin: auto;padding: 0 40px;}
#location_list_box .location_list_ttl{text-align: left;padding: 40px 0 0;}
#location_list_box .location_list_ttl img{max-width: 100%;height: auto;}
#location_list_box .location_list_ttl .txt{display: block;font-size: 16px;line-height: 1.2;letter-spacing: 0.14em;font-weight: 700;text-align: right;color: #0071ae;margin: -10px 0 0;}
#location_list_box .inner{display: flex;margin: 15px 0 60px;padding: 0 0 0 60px;position: relative;}
#location_list_box .inner::before{content: "";display: block;width: 40px;background-size: auto auto;background-color: rgba(255, 255, 255, 0);background-image: repeating-linear-gradient(135deg, transparent, transparent 5px, rgba(55, 128, 188, 1) 5px, rgba(55, 128, 188, 1) 7px );opacity: 0.25;position: absolute;top: 0;bottom: 0;left: 0;}
#location_list_box ul{width: calc((100% - 40px)/2);}
#location_list_box ul + ul{margin-left: 40px;}
#location_list_box ul li{font-size: 14px;line-height: 1.2;text-align: left;border-top: 1px solid #8b8b8b;padding: 10px 0;box-sizing: border-box;}
#location_list_box ul li:last-of-type{border-bottom: 1px solid #8b8b8b;}
#location_list_box ul li span{float: right;}
@media screen and (min-width:768px){
}
@media screen and (max-width:767px){
#location_list_box{padding: 0;}
#location_list_box .location_list_ttl{padding: 20px 20px 0;}
#location_list_box .location_list_ttl .txt{margin: 0;}
#location_list_box .inner{display: block;margin: 20px 0 40px;padding: 0 20px 0 40px;}
#location_list_box .inner::before{width: 20px;}
#location_list_box ul{width: 100%;}
#location_list_box ul + ul{margin: 0;}
#location_list_box ul li{font-size: 12px;}
#location_list_box ul li:last-of-type{border-bottom:none;}
#location_list_box ul:last-of-type li:last-of-type{border-bottom: 1px solid #8b8b8b;}
}
@media screen and (max-width:374px){
#location_list_box ul li span{display: block;text-align: right;float: none}
}

/*物件概要----------#outline_box*/

#outline_box{margin: -80px 0 0;padding: 80px 0 0;}
#outline_box .inner{max-width: 1000px;margin: auto;padding: 0 40px;}
#outline_box .caption{display: block;font-size: 16px;line-height: 1.1;font-weight: 700;text-align: left;color: #0071ae;margin: -10px 0 10px;}
#outline_box .table_wrap{padding: 0 60px 0 0;position: relative;}
#outline_box .table_wrap::before{content: "";display: block;width: 40px;background-size: auto auto;background-color: rgba(255, 255, 255, 0);background-image: repeating-linear-gradient(135deg, transparent, transparent 5px, rgba(55, 128, 188, 1) 5px, rgba(55, 128, 188, 1) 7px );opacity: 0.25;position: absolute;top: 0;bottom: 0;right: 0;}
#outline_box table{width: 100%;border-collapse: collapse;border-spacing: 0;}
#outline_box table tr th,
#outline_box table tr td{font-size: 14px;line-height: 1.2;text-align: left;border-top: 1px solid #8b8b8b;padding: 10px 0;box-sizing: border-box;}
#outline_box table tr th{width: 8em;}
#outline_box table tr:last-child th,
#outline_box table tr:last-child td{border-bottom: 1px solid #8b8b8b;}
@media screen and (min-width:768px){
}
@media screen and (max-width:767px){
#outline_box .inner{padding: 0;}
#outline_box .caption{margin: 0 0 10px 20px;}
#outline_box .table_wrap{padding: 0 40px 0 20px;}
#outline_box .table_wrap::before{width: 20px;}
#outline_box table tr th,
#outline_box table tr td{font-size: 13px;}
}

/*施工例バナー----------#example*/

#main .example{max-width: 1000px;margin: 100px auto 30px;padding: 0 40px;}
#main .example img{width: 100%;height: auto;vertical-align: top;}
@media screen and (min-width:768px){
#main .example a img{transition:.3s;}
#main .example a:hover img{opacity: 0.5;}
}
@media screen and (max-width:767px){
#main .example{margin: 40px 20px 30px;padding:0;}
}

/*バナー----------#banner*/

#main .banner{max-width: 1000px;margin: auto;padding: 0 40px 40px;}
#main .banner .banner_ttl{font-size: 20px;letter-spacing: 0.04em;font-weight: 700;text-align: left;margin: 90px 0 0;position: relative;}
#main .banner .banner_ttl::before{content: "";display: block;width: 100%;height: 2px;background-color: #3780bc;margin: auto;position: absolute;top: 0;right: 0; bottom: 0;left: 0;}
#main .banner .banner_ttl span{display: inline-block;background-color: #FFF;padding: 0 30px 0 0;position: relative;}
#main .banner ul{letter-spacing: -1em;}
#main .banner ul li{display: inline-block;letter-spacing: normal;vertical-align: top;width: calc((100% - 70px)/3);margin: 30px 35px 0 0;}
#main .banner ul li:nth-child(3n){margin-right: 0;}
#main .banner ul li img{width: 100%;height: auto;vertical-align: top;}
#main .banner .list01{}
#main .banner .list02{}
@media screen and (min-width:768px){
#main .banner a img{transition:.3s;}
#main .banner a:hover img{opacity: 0.5;}
}
@media screen and (max-width:767px){
#main .banner{margin: 0 20px 30px;padding:0;}
#main .banner .banner_ttl{margin: 30px 0 0;}
#main .banner ul{text-align: left;}
#main .banner ul li{width: calc((100% - 15px)/2);margin: 10px 15px 0 0;}
#main .banner ul li:nth-child(3n){margin-right: 15px;}
#main .banner ul li:nth-child(2n){margin-right: 0;}
}