@charset "utf-8";
/* Copyright 2022 design hack. */

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

ホーム

------------------------------------------------------------ */
/* プロモーション
---------------------------------------------- */
div#wrap_slider{background: linear-gradient(180deg, #ffffff 0%, #ffffff 50%, #F3F3F3 50%, #F3F3F3 100%);height: 500px;}
@media print, screen and (min-width: 768px){
ul#sp_slider{display: none;}
ul#pc_slider li{position: relative;overflow: hidden;height: 500px;}
ul#pc_slider li img{position: absolute;top: 50%;left: 50%;width: 1500px;height: 500px;transform: translate(-50%, -50%);}
}
@media print, screen and (max-width: 767px){
div#wrap_slider{padding: 0 15px;height:auto;}
ul#pc_slider{display: none;}
ul#sp_slider li{width:100%;height: auto;}
ul#sp_slider li img{width:100%;height: auto;}
}

/* greeting
---------------------------------------------- */
section#greeting{padding: 100px 0;width: 1200px;height: 530px;margin: 0 auto;text-align: center;position: relative;box-sizing: border-box;}
section#greeting h2{background: url(../img/ttl_greeting.png) no-repeat center 0;background-size: 124px 50px;padding-top: 70px;font-size: 34px;color: #5F5F5F;font-weight: bold;line-height: 1.0;margin-bottom: 45px;}
ul#list_img_greeting li:first-child{position: absolute;top: 180px;left: 0;}
ul#list_img_greeting li:last-child{position: absolute;top: 100px;right: 0;}

@media print, screen and (max-width: 767px){
section#greeting{background:none;padding:50px 0;width: 100%;height: auto;margin: 0;}
section#greeting h2{background: url(../img/ttl_greeting.png) no-repeat center 0;background-size: 99px 40px;padding-top: 55px;font-size: 18px;margin-bottom:25px;}
ul#list_img_greeting{display: none;}
}

/* works
---------------------------------------------- */
section#works{padding: 100px 0;width: 1200px;margin: 0 auto;}
section#works h2{background: url(../img/ttl_works.png) no-repeat left 0.27em;background-size: 72px 24px;padding-left: 92px;font-size: 30px;color: #5F5F5F;font-weight: bold;line-height: 1.0;margin-bottom: 40px;}
ul#list_works{overflow: hidden;margin-bottom: 50px;}
ul#list_works li{float: left;width: 270px;margin-right: 40px;}
ul#list_works li:last-child{margin-right: 0;}
ul#list_works li p{width: 270px;height: 270px;overflow: hidden;position: relative;}
ul#list_works li p img{width: auto;height: 270px;position: absolute;top: 50%;left: 50%;-webkit-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);transform: translate(-50%, -50%);}
ul#list_works li p img:hover{opacity: 0.7;}
ul#list_works li dl dt{background: #7ECDEB;padding: 4px 10px 6px;line-height: 1.0;font-size: 14px;color: #FFFFFF;display: inline-block; margin:10px 0 4px;}
ul#list_works li dl dd{font-weight: bold;}
ul#list_works li a:hover dl dd{color: #7ECDEB;}

@media print, screen and (max-width: 767px){
section#works{padding: 50px 0;width: 100%;}
section#works h2{background: url(../img/ttl_works.png) no-repeat left 0.27em;background-size: 45px 15px;padding-left: 55px;font-size: 18px;margin-bottom: 20px;}
ul#list_works{overflow: hidden;margin-bottom: 25px;width: 100%;}
ul#list_works li{float: left;width: 48%;margin: 0 4% 15px 0;}
ul#list_works li:nth-child(2n){margin-right: 0;}
ul#list_works li p{width: 100%;height: 165px;overflow: hidden;position: relative;}
ul#list_works li p img{width:auto;height:200px;position: absolute;top: 50%;left: 50%;-webkit-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);transform: translate(-50%, -50%);}
ul#list_works li p img:hover{opacity: 0.7;}
ul#list_works li dl dt{padding: 4px 10px 6px;line-height: 1.0;font-size: 14px;color: #FFFFFF;display: inline-block; margin:10px 0 6px;}
}

/* service
---------------------------------------------- */
section#service{padding: 100px 0;width: 1200px;margin: 0 auto;}
section#service div.wrap_service{width: 100%;overflow: hidden;}
section#service div.wrap_service:first-child{margin-bottom: 80px;}
section#service div.wrap_service p.img_service01{float: left; width: 580px;margin-right: 50px;}
section#service div.wrap_service p.img_service01 img{width: 580px;}
section#service div.wrap_service div.box_service01{float: right; width: 570px;}
section#service div.wrap_service p.img_service02{float: right; width: 580px;}
section#service div.wrap_service p.img_service02 img{width: 580px;}
section#service div.wrap_service div.box_service02{float: left; width: 570px;margin-right: 50px;}
section#service p.btn_more img{width: 130px;height: 24px;}

@media print, screen and (max-width: 767px){
section#service{padding: 50px 0;width: 100%;margin: 0;}
section#service div.wrap_service{width: 100%;overflow: hidden;}
section#service div.wrap_service:first-child{margin-bottom: 40px;}
section#service div.wrap_service p.img_service01,section#service div.wrap_service p.img_service02{float: none; width: 100%;margin:0 0 25px 0;display: block;}
section#service div.wrap_service p.img_service01 img,section#service div.wrap_service p.img_service02 img{width: 100%;}
section#service div.wrap_service div.box_service01,section#service div.wrap_service div.box_service02{float: none;display: block; width: 100%;margin-right: 0;}
section#service p.btn_more img{width: 114px;height: 21px;}
}

/* other
---------------------------------------------- */
div#other{padding: 100px 0;width: 1200px;margin: 0 auto;}
div#other ul li:first-child{margin-bottom: 40px;}
@media print, screen and (max-width: 767px){
div#other{padding: 50px 0;width: 100%;}
div#other ul li:first-child{margin-bottom: 20px;}
div#other ul li img{width: 100%;}
}

/* other
---------------------------------------------- */
div#wrap_murayama{text-align: center;padding: 100px 0;}
div#wrap_murayama p img:hover{opacity: 0.7;}
@media print, screen and (max-width: 767px){
div#wrap_murayama{text-align: center;padding: 50px 0;}
div#wrap_murayama p img{width: 100%;}
}