/*   home   */
.page-home .slider {
	overflow: hidden;
	width: 100%;
}
.page-home .slider-img {
    width: 100%;
}

/*   選ばれる理由   */

.page-home .reason_wrapper {
    margin-top: 50px;
}

.page-home .reason_title {
    text-align: center;
}

.page-home .reason_list {
    display: flex;
    justify-content: space-between;
}

.page-home .reason_list_item {
    width: 30%;
}

.page-home .reason_title img, .reason_list_item {
    max-width: 100%;
}

.page-home .reason_list_main_img {
    width: 100%;
}

.page-home .reason_list_item_title {
    margin-bottom: 20px;
    text-align: center;
}

.page-home .reason_list_item p {
    font-size: 20px;
}

.arrow {
    position: relative;
    display: block;
    padding: 0 24px 0 0;
    font-weight: 600;
    text-align: right;
    font-size: 20px;
    color: #f39800;
    vertical-align: middle;
    text-decoration: underline;
}

.arrow:hover {
  text-decoration: none;
}

.arrow::before,
.arrow::after{
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
}

.page-home .reason_list_item_link::before{
    width: 20px;
    height: 20px;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    background: #f39800;
}

.page-home .reason_list_item_link::after{
    right: -1px;
    box-sizing: border-box;
    width: 10px;
    height: 10px;
    border: 6px solid transparent;
    border-left: 8px solid #fff;
}


@media screen and (max-width: 768px) {

    .page-home .reason_list {
        display: block;
    }

    .page-home .reason_list_item {
        width: 100%;
        margin-bottom: 50px;
    }

    .arrow {
        font-size: 14px;
    }

    .page-home .reason_list_item p {
        font-size: 14px;
    }
}


/*   ご希望のサービス   */

.page-home .service_wrapper {
    margin-top: 80px;
}

.page-home .service_title {
    display: flex;
    margin-bottom: 30px;
    align-items: center;
    text-align: center;
    font-size: 35px;
    font-weight: bold;
    text-align: center;
}

.page-home .service_title:before,
.page-home .service_title:after {
    border-top: 1px solid;
    content: "";
    display: inline; /* for IE */
    flex-grow: 1;
}

.page-home .service_title:before {
    margin-right: 0.5em;
    margin-left: 20px;
}

.page-home .service_title:after {
    margin-left: 0.5em;
    margin-right: 20px;
}

.page-home .service_area {
    display: flex;
    justify-content: space-between;
    margin-bottom: 30px;
}

.page-home .service_area_paint {
    width: 48.5%;
    padding: 50px 0;
    background: url(../images/home/service_list_img01.png)no-repeat;
    background-size: cover;
    text-align: center;
    color: #ffffff;
    box-shadow: 3px 3px 2px rgba(0,0,0,0.4);
}

.page-home .service_area_reform {
    width: 48.5%;
    padding: 50px 0;
    background: url(../images/home/service_list_img02.png)no-repeat;
    background-size: cover;
    text-align: center;
    color: #ffffff;
    box-shadow: 3px 3px 2px rgba(0,0,0,0.4);
}

.page-home .service_area_paint_title,
.service_area_reform_title {
    font-size: 65px;
    font-weight: bold;
    line-height: 1;
}

.page-home .service_area_paint_title:before {
    content: "";
    display: inline-block;
    width: 1em;
    height: 1em;
    background: url(../images/home/service_list_paint.png) no-repeat;
    background-size: contain;
}

.page-home .service_area_description {
    margin: 30px 0;
    font-size: 23px;
    line-height: 1;
}

.page-home .service_area_reform_title:before {
    content: "";
    display: inline-block;
    width: 1em;
    height: 1em;
    background: url(../images/home/service_list_reform.png) no-repeat;
    background-size: contain;
}

.page-home .service_area_more {
    display: block;
    padding: 21px 0;
    margin: auto;
    font-size: 24px;
    background: #ffffff;
    width: 280px;
}

.page-home .service_area_more.stg-green:hover {
    color: #ffffff;
    background: #8fc31f;
}

.page-home .service_area_more.stg-blue:hover {
    color: #ffffff;
    background: #0068b7;
}

.service_case {
    background-image: url(/assets/images/home/service_list_img03.png);
    background-size: cover;
    padding: 50px 2.6%;
    text-align: center;
}

.service_case_description {
    font-size: 20px;
    color: #ffffff;
}

.service_case_bnr {
    margin-top: 30px;
    border-radius: 10px;
    vertical-align: bottom;
}



@media screen and (max-width: 768px) {

    .page-home .service_title {
        font-size: 27px;
    }

    .page-home .service_title span {
        display: contents;
    }

    .page-home .service_area_paint_title,
    .service_area_reform_title {
        font-size: 38px;
    }
        
    .page-home .service_area_description {
        font-size: 14px;
    }

    .page-home .service_area {
        display: block;
    }

    .page-home .service_area_more {
        padding: 16px 0;
        width: 160px;
        font-size: 16px;
    }

    .page-home .service_area_paint {
        width: 100%;
        margin-bottom: 30px;
        padding: 25px 0;
    }

    .page-home .service_area_reform {
        width: 100%;
        padding: 25px 0;
    }

    .service_case {
        background-image: url(/assets/images/home/service_list_img03_sp.png);
        background-size: cover;
    }

    .service_area_more,
    .service_case_description {
        font-size: 14px;
    }

    .service_case_bnr {
        max-width: 100%;
    }

    .page-home .service_title:after {
        margin-left: 0.5em;
        margin-right: 20px;
    }
        
    .page-home .service_title:after {
        margin-left: 0.5em;
        margin-right: 20px;
    }
}

@media screen and ( max-width:375px ) {
    
    .page-home .service_title {
        font-size: 22px;
    }
    
    .page-home .service_title:before {
        margin-left: 10px;
    }
    
    .page-home .service_title:after {
        margin-right: 10px;
    }
}


/*   ご不明点ございましたら   */

.page-home .solution_wrapper {
    background-image: url(/assets/images/home/solution_list_bk.png);
    background-size: cover;
    padding: 50px 0 130px;
}

.page-home .solution_description {
    text-align: center;
}

.page-home .solution_list {
    display: flex;
    justify-content: space-between;
    margin-top: 50px;
}

.page-home .solution_list_item {
    width: 30%;
    background: url(/assets/images/home/solution_list_item_bk.png) no-repeat;
    background-size: cover;
    padding: 14px;
    box-sizing: border-box;
    box-shadow: 2px 2px 1px rgba(0,0,0,0.2);
}

.page-home .solution_list_item:nth-child(even) {
    transform: translateY(50px);
}

.page-home .solution_list_img_main {
    width: 100%;
    position: relative;
    top: -35px;
}

.page-home .solution_list_description {
    font-size: 20px;
    text-align: justify;
    position: relative;
    top: -30px;
}

.page-home .solution_list_item_more {
    position: relative;
    top: -15px;
    display: block;
    width: 60%;
    padding: 15px 0;
    margin: 10px auto 0;
    text-align: center;
    font-size: 24px;
    color: #ffffff;
}


@media screen and (max-width: 768px) {


    .page-home .solution_wrapper {
        background-image: url(/assets/images/home/solution_list_bk_sp.png);
    }

    .page-home .solution_wrapper {
        padding-bottom: 50px;
    }

    .page-home .solution_description img {
        max-width: 100%;
    }

    .page-home .solution_list {
        display: block;
    }

    .page-home .solution_list_item {
        width: 100%;
        margin-bottom: 80px;
    }
        
    .page-home .solution_list_item:nth-child(even) {
        transform: translateY(0);
    }

    .page-home .solution_list_description, .solution_list_item_more {
        font-size: 14px;
    }
    
    .page-home .solution_list_item_more {
        font-size: 16px;
    }
}

/*   reason 選ばれる理由   */

.page-reason .point_list_items {
    display: flex;
    justify-content: space-around;
    margin: 100px 0 0 0;
}

.page-reason .point_list_item {
    width: 30%;
    border: 1px solid #808080;
    box-sizing: border-box;
    text-align: center;
}

.page-reason .point_list_item_btn {
    display: block;
    padding: 30px 20px;
}

.page-reason .point_list_item_point {
    margin-bottom: 20px;
    font-size: 20px;
}

.page-reason .reason_point {
    margin-bottom: 20px;
    font-size: 30px;
}

.page-reason .point_list_item_title {
    margin-top: 20px;
    font-size: 25px;
}

.page-reason .reason_point_arrow {
    position: relative;
    z-index: 1;
    display: block;
    width: 40px;
    height: 40px;
    margin: auto;
    border-top: 2px solid #f39800;
    border-right: 2px solid #f39800;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
}

.page-reason .point_about_title {
    margin-bottom: 56px;
    font-size: 35px;
    text-align: center;
}

.page-reason .reason_point_about {
    display: flex;
    justify-content: space-between;
}

.page-reason .reason_point_about_description {
    width: 50%;
    position: relative;
}

.page-reason .reason_point_about_description p {
    font-size: 16px;
    margin: 1em 0;
    text-align: justify;
}

.page-reason .reason_point_about_btn {
    position: absolute;
    bottom: 0;
    padding: 20px 0;
    margin: 10px auto 0;
    text-align: center;
    color: #ffffff;
    width: 240px;
    font-size: 20px;
}

.page-reason .reason_item {
    padding: 100px 0;
}

.page-reason .point_about_title span {
	display: inline-block;
	font-size: 20px;
	background-color: #f39800;
	color: #fff;
	padding: 10px 20px;
	vertical-align: 4px;
	margin: 0 20px 0 0;
}

.page-reason .reason_item:nth-of-type(odd) {
	background-color: #fef4e5;
}

.page-reason .reason_summary {
	background-color: #eeeeee;
	margin: 0 0 120px;
}

.page-reason .reason_summary .wrapper {
	padding: 90px 0;
}

.page-reason .reason_summary-description {
    padding: 0 20px;
	text-align: center;
	line-height: 1.6em;
    font-size: 20px;
}

.page-reason .reason_showmore {
    padding-bottom: 100px;
}

.page-reason .reason_showmore-description {
	text-align: center;
	margin: 0 0 40px;
  font-size: 20px;
}
.page-reason .reason_showmore-list {
	display: flex;
	justify-content: center; 
}
.page-reason .reason_showmore-list-item {
	width: 480px;
	margin-right: 40px;
}
.page-reason .reason_showmore-list-item-btn {
	position: relative;
	display: block;
	padding: 46px 0;
	text-align: center;
	background: #eee;
	color: #fff;
	font-size: 25px;
}

.page-reason .reason_showmore-list-item-btn::before,
.page-reason .reason_showmore-list-item-btn::after{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 10px;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.page-reason .reason_showmore-list-item-btn::before{
	right: 24px;
	width: 16px;
	height: 16px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
.page-reason .reason_showmore-list-item-btn-case {
	background-color: #3ea0cc;
}
.page-reason .reason_showmore-list-item-btn-voice {
	background-color: #df6262;
}

@media screen and (max-width: 768px) {

    .page-reason .point_list_items {
        margin: 50px 0 0 0;
    }

    .page-reason .reason_point_about {
        display: block;
        text-align: center;
    }

    .page-reason .reason_point_about_description {
        width: 100%;
    }

    .page-reason .reason_point_about_btn {
        display: block;
        position: static;
        width: 100%;
        font-size: 16px;
    }

    .page-reason .point_list_items {
        display: block;
    }

    .page-reason .point_list_item {
        width: 100%;
        margin-bottom: 20px;
    }

    .page-reason .point_about_title {
        margin-bottom: 20px;
        font-size: 15px;
        text-align: left;
    }

    .page-reason .point_icon_area {
        display: flex;
        justify-content: space-around;
        align-items: center;
    }

    .page-reason .point_icon_area img {
        width: 100%;
    }

    .page-reason .point_icon_img {
        width: 35%;
    }

    .page-reason .reason_item {
        padding: 0 2.6%;
    }

    .page-reason .point_list_item_title {
        font-size: 18px;
    }

    .page-reason .reason_point_about_description p {
        font-size: 14px;
    }

    .page-reason .reason_item .wrapper {
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .page-reason .reason_point_title {
        font-size: 20px;
    }

    .page-reason .point_about_title span {
        margin: 0 20px 20px 0;
    }

    .page-reason .reason_point_description {
        font-size: 14px;
    }

    .page-reason .reason_item img {
        width: 100%;
    }
        
    .page-reason .reason_showmore-list {
        display: block;
    }

    .page-reason .reason_showmore-list-item {
        width: 100%;
        margin-right: 0;
        margin-bottom: 20px;
    }

    .page-reason .reason_showmore {
        padding-bottom: 0;
    }

    .page-reason .reason_summary {
        margin: 0 0 40px;
    }

    .page-reason .reason_summary .wrapper {
        padding: 40px 0;
    }

    .page-reason .reason_summary-description {
        font-size: 14px;
    }

    .page-reason .reason_showmore-list-item-btn {
        padding: 26px 0;
        font-size: 16px;
    }

    .page-reason .reason_showmore-description {
        margin-bottom: 20px;
        font-size: 16px;
    }
}

/*   voice お客様の声   */

.page-voice .voice_list_item {
    margin: 0 0 50px 0;
}

.page-voice .voice_list_header {
    background-color: #FBE0BD;
    padding: 10px 20px;
    margin: 0 0 38px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.page-voice .voice_list_header_name {
    background-color: #FBE0BD;
    font-size: 24px;
}

.page-voice .voice_list_cols {
    display: flex;
}

.page-voice .voice_list_img {
    min-width: 600px;
    line-height: 0;
}

.page-voice .voice_list_img img {
    width: 100%;
}

.page-voice .voice_list_txt {
    padding-left: 35px;
    box-sizing: border-box;
}

.page-voice .voice_list_use_paint_txt {
    display: inline-block;
    padding: 5px 10px;
    margin-bottom: 20px;
    color: #ffffff;
}

.page-voice .voice_list_use_paint_btn {
    display: block;
    font-size: 20px;
    text-decoration: underline;
}

.page-voice .voice_list_txt_item {
    margin-bottom: 55px;
}

@media screen and (max-width: 768px) {

    .page-voice .voice_list_item {
        margin: 0 0 25px 0;
    }

    .page-voice .voice_list_header {
        padding: 10px 10px;
        margin: 0 0 18px 0;
    }

    .page-voice .voice_list_header_name {
        background-color: #FBE0BD;
        font-size: 18px;
    }
    
    .page-voice .voice_list_cols {
        display: block;
    }

    .page-voice .voice_list_cols_item {
        width: 100%;
    }
    
    .page-voice .voice_list_txt_item {
        margin-bottom: 30px;
    }
    
    .page-voice .voice_list_txt {
        padding: 0;
    }
    
    .page-voice .voice_list_img {
        min-width: auto;
        margin: 0 0 15px 0;
    }
    
    .page-voice .voice_list_use_paint_txt {
        margin-bottom: 10px;
    }
    
}

/* Q and A */

.page-qanda .qanda_nav {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin: 100px 0 0 0;
}

.page-qanda .qanda_nav_item {
    width: 320px;
    margin: 0 20px;
}

.page-qanda .qanda_nav_btn {
    color: #fff;
    display: block;
    padding: 25px 0;
    text-align: center;
    font-size: 24px;
    position: relative;
}

.page-qanda .qanda_nav_btn:after {
    content: "";
    position: absolute;
    display: block;
    width: 10px;
    height: 10px;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    transform: rotate(45deg);
    right: 30px;
    top: 50%;
    margin: -8px 0 0 0;
}

.page-qanda .qanda_nav_btn_paint {
    background-color: #699225;
}

.page-qanda .qanda_nav_btn_reform {
    background-color: #0C648A;
}

.page-qanda .qanda_list {
    padding: 100px 0 0 0;
}

.page-qanda .qanda_list_hd {
    position: relative;
}

.page-qanda .qanda_list_hd_ttl {
    font-size: 35px;
    border-bottom: 2px solid #000;
    padding: 0 0 10px 0;
}

.page-qanda .qanda_list_paint .qanda_list_hd_ttl {
    color: #699225;
    border-color: #699225;
}

.page-qanda .qanda_list_reform .qanda_list_hd_ttl {
    color: #0C648A;
    border-color: #0C648A;
}

.page-qanda .qanda_list_hd_note {
    top: 15px;
    right: 0;
    position: absolute;
    font-size: 18px;
}

.page-qanda .qanda_list_wrap {
    border-bottom: 1px solid #000;
    padding: 25px 0;
}

.page-qanda .qanda_list_question {
    font-size: 20px;
    position: relative;
    cursor: pointer;
    padding: 0 25px 0 25px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.page-qanda .qanda_list_question:before {
    /*position: absolute;*/
    content: "Q";
    font-weight: bold;
    font-size: 35px;
    font-family: Helvetica, Arial, sans-serif;
    margin: 0 25px 0 0;
    /*left: 20px;*/
    /*top: 50%;*/
    /*margin: -20px 0 0 0;*/
    line-height: 1;
    color: #000;
}

.page-qanda .qanda_list_paint .qanda_list_question:before {
    color: #699225;
}

.page-qanda .qanda_list_reform .qanda_list_question:before {
    color: #0C648A;
}

.page-qanda .qanda_list_question_i {
    margin-left: auto;
    /*position: absolute;*/
    /*right: 0;*/
    /*top: 50%;*/
    /*margin: -25px 0 0 0;*/
}

.page-qanda .qanda_list_wrap.open .qanda_list_question_i:after {
    transform: rotate(45deg);
}

.page-qanda .qanda_list_answer {
    display: flex;
    visibility: hidden;
    opacity: 0;
    font-size: 18px;
    position: relative;
    background-color: #f3f3f3;
    border-radius: 5px;
    line-height: 1.8;
    /*justify-content: space-between;*/
    transition-duration: 0.3s;
    transition-timing-function: ease-out;
    padding: 0 25px;
    height: 0;
}

.page-qanda .open .qanda_list_answer {
    height: auto;
    visibility: visible;
    opacity: 1;
    padding: 25px 25px 25px 25px;
    margin: 25px 0 0 0;
}

.page-qanda .qanda_list_paint .qanda_list_answer {
    background-color: #F4FAEB;
}

.page-qanda .qanda_list_reform .qanda_list_answer {
    background-color: #F1FAFE;
}

.page-qanda .qanda_list_answer:before {
    /*position: absolute;*/
    content: "A";
    font-weight: bold;
    font-size: 35px;
    font-family: Helvetica, Arial, sans-serif;
    /*left: 20px;*/
    /*top: 22px;*/
    line-height: 1;
    color: #bf0000;
    margin: 0 25px 0 0;
}

@media screen and (max-width: 768px) {

    .page-qanda .qanda_nav {
        margin: 50px 0 0 0;
    }

    .page-qanda .qanda_nav_item {
        width: 100%;
        margin: 0 0 15px 0;
    }

    .page-qanda .qanda_nav_btn {
        font-size: 16px;
    }

    .page-qanda .qanda_list {
        padding: 25px 0 0 0;
    }

    .page-qanda .qanda_list_hd_ttl {
        font-size: 24px;
    }

    .page-qanda .qanda_list_hd_note {
        top: auto;
        right: auto;
        position: relative;
        font-size: 12px;
        padding: 12px 0 12px 0;
        border-bottom: 1px solid #000;
    }

    .page-qanda .qanda_list_wrap {
        padding: 15px 0;
    }

    .page-qanda .qanda_list_question {
        padding: 0 15px 0 15px;
        font-size: 14px;
        align-items: flex-start;
    }

    .page-qanda .qanda_list_question:before {
        font-size: 20px;
        margin: 0 15px 0 0;
    }

    .page-qanda .qanda_list_question_txt {
        padding: 0 10px 0 0;
    }

    .page-qanda .qanda_list_question_i {
    }

    .page-qanda .qanda_list_answer {
        font-size: 12px;
        padding: 0 15px 0 15px;
    }

    .page-qanda .open .qanda_list_answer {
        padding: 15px 15px 15px 15px;
    }

    .page-qanda .qanda_list_answer:before {
        font-size: 20px;
        margin: 0 15px 0 0;
    }

}

/* 会社概要 */

.page-company .profile_list {
    border-top: 1px solid #ccc;
}

.page-company .profile_list_wrap {
    display: table;
    width: 100%;
    border-bottom: 1px solid #ccc;
}

.page-company .profile_list_ttl {
    display: table-cell;
    background-color: #F09826;
    color: #fff;
    width: 200px;
    font-size: 20px;
    padding: 20px 25px;
}

.page-company .profile_list_cont {
    display: table-cell;
    font-size: 20px;
    padding: 20px 25px;
}

.page-company .access_map {
    height: 450px;
    position: relative;
    margin: 0 auto 40px auto;
}

.page-company .access_map iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.page-company .access_info {
    text-align: center;
}

@media screen and (max-width: 768px) {

    .page-company .profile_list_wrap {
        display: block;
        border-bottom: 1px solid #ccc;
    }

    .page-company .profile_list_ttl {
        display: block;
        width: 100%;
        font-size: 14px;
        padding: 10px 10px;
        box-sizing: border-box;
    }

    .page-company .profile_list_cont {
        display: block;
        font-size: 14px;
        padding: 10px 10px;
    }

    .page-company .access_map {
        height: 250px;
        margin: 0 auto 20px auto;
    }

}

/* 問い合わせ */

.page-contact .form_list {
    border-top: 1px solid #ccc;
    margin: 0 0 100px 0;
}

.page-contact .form_list_wrap {
    display: table;
    border-bottom: 1px solid #ccc;
    width: 100%;
    padding: 35px 0;
}

.page-contact .form_list_ttl {
    display: table-cell;
    width: 260px;
    padding: 8px 35px;
    vertical-align: top;
    font-size: 18px;
    position: relative;
}

.page-contact .form_list_ttl:after {
    position: absolute;
    display: block;
    font-size: 16px;
    font-weight: bold;
    padding: 1px 8px;
    border-radius: 5px;
    right: 0;
    top: 5px;
    border: 1px solid #F09826;
}

.page-contact .is_required .form_list_ttl:after {
    content: "必須";
    background-color: #F09826;
    color: #fff;
}

.page-contact .is_any .form_list_ttl:after {
    content: "任意";
    background-color: #fff;
    color: #F09826;
}

.page-contact .form_list_cont {
    display: table-cell;
    padding: 0 35px;
    vertical-align: top;
}

.page-contact .form_list_cont .input {
    padding: 10px;
    font-size: 18px;
    width: 100%;
    box-sizing: border-box;
}

.page-contact .form_list_cont .textarea {
    padding: 10px;
    height: 10em;
    font-size: 18px;
    width: 100%;
    box-sizing: border-box;
}

.page-contact .form_list_note {
    display: block;
    margin: 15px 0 0 0;
}

.page-contact .form_action {
    display: flex;
    justify-content: center;
}

.page-contact .form_action_btn {
    display: block;
    font-weight: bold;
    font-size: 20px;
    padding: 30px 0;
    width: 400px;
    text-align: center;
    border-radius: 5px;
    margin: 0 10px;
    position: relative;
}

.page-contact .form_action_btn:hover {
    opacity: 1;
    border-radius: 0;
    letter-spacing: 1px;
}

.page-contact .form_action_btn_send {
    background-color: #F09826;
    border: 2px solid #F09826;
    color: #fff;
}

.page-contact .form_action_btn_send:hover {
    background-color: #fff;
    color: #F09826;
}

.page-contact .form_action_btn_send:after {
    position: absolute;
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: rotate(45deg);
    right: 20px;
    top: 50%;
    margin: -6px 0 0 0;
    transition-duration: 0.3s;
    transition-timing-function: ease-out;
}

.page-contact .form_action_btn_send:hover:after {
    border-color: #F09826;
    right: 15px;
}

.page-contact .form_action_btn_back {
    background-color: #aaa;
    border: 2px solid #aaa;
    color: #fff;
}

.page-contact .form_action_btn_back:hover {
    background-color: #fff;
    color: #aaa;
}

.page-contact .form_action_btn_back:before {
    position: absolute;
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    border-bottom: 2px solid #fff;
    border-left: 2px solid #fff;
    transform: rotate(45deg);
    left: 20px;
    top: 50%;
    margin: -6px 0 0 0;
    transition-duration: 0.3s;
    transition-timing-function: ease-out;
}

.page-contact .form_action_btn_back:hover:before {
    border-color: #aaa;
    left: 15px;
}

@media screen and (max-width: 768px) {

    .page-contact .form_list {
        margin: 0 0 30px 0;
    }

    .page-contact .form_list_wrap {
        display: block;
        padding: 15px 0;
    }

    .page-contact .form_list_ttl {
        display: block;
        width: 100%;
        padding: 0 10px 4px 10px;
        margin: 0 0 10px 0;
        font-size: 14px;
        box-sizing: border-box;
    }

    .page-contact .form_list_ttl:after {
        font-size: 13px;
        padding: 2px 6px;
        border-radius: 3px;
        top: 0;
        right: 10px;
    }

    .page-contact .form_list_cont {
        display: block;
        padding: 0 10px;
    }

    .page-contact .form_list_note {
        margin: 10px 0 0 0;
        font-size: 12px;
    }

    .page-contact .form_list_cont .input {
        padding: 6px;
        font-size: 14px;
    }

    .page-contact .form_list_cont .textarea {
        padding: 6px;
        font-size: 14px;
    }

    .page-contact .form_action {}

    .page-contact .form_action_btn {
        font-size: 16px;
        padding: 15px 0;
        max-width: 400px;
        text-align: center;
        border-radius: 5px;
    }


}

.page-contact .finished_copy_item {
    font-size: 18px;
    text-align: center;
    margin: 0 0 15px 0;
}

.page-contact .finished_action {
    text-align: center;
    margin: 50px 0 0 0;
}

.page-contact .finished_action_btn {
    display: inline-block;
    font-weight: bold;
    font-size: 18px;
    padding: 20px 0;
    width: 300px;
    text-align: center;
    margin: 0 10px;
    background-color: #F09826;
    border: 2px solid #F09826;
    color: #fff;
}

@media screen and (max-width: 768px) {

    .page-contact .finished_copy_item {
        font-size: 14px;
        margin: 0 0 10px 0;
    }

    .page-contact .finished_action {
        margin: 30px 0 0 0;
    }

    .page-contact .finished_action_btn {
        font-size: 14px;
        padding: 12px 0;
        max-width: 400px;
        text-align: center;
        border-radius: 5px;
    }

}


/* 料金・塗料一覧 */

.page-fee .fee_list_wrap {
    width: 1180px;
    margin: auto;
}

.page-fee .fee_list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.page-fee .fee_list_item {
    display: flex;
    width: 48%;
    padding-bottom: 100px;
    margin-top: -86px;
    padding-top: 86px;
    box-sizing: border-box;
}

.page-fee .fee_list_item_ttl {
    font-size: 30px;
}

.page-fee .fee_list_item_img {
    margin-right: 25px;
}

.page-fee .fee_list_item_txt {
    margin-bottom: 10px;
    font-size: 16px;
}

.page-fee .fee_list_item_price {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

.page-fee .fee_list_item_years {
    display: flex;
    align-items: center;
}


.page-fee .fee_list_item_price_color {
    padding: 5px 10px;
    margin-right: 10px;
    color: #ffffff;
    background-color: #F09826;
}

.page-fee .fee_list_item_years_color {
    padding: 5px 10px;
    margin-right: 10px;
    color: #ffffff;
    background-color: #9CD055;
}

@media screen and ( max-width: 768px ) {

    .page-fee .fee_list_wrap {
        width: 100%;
    }
    
    .page-fee .fee_list {
        display: block;
    }
    
    .page-fee .fee_list_item {
        width: 100%;
        padding-bottom: 35px;
    }
    
    .page-fee .fee_list_item_ttl {
        margin-bottom: 12px;
        font-size: 18px;
        line-height: 1;
    }
    
    .page-fee .fee_list_item_txt {
        font-size: 14px;
    }
    
    .page-fee .fee_list_item_img,
    .page-fee .fee_list_item_details {
        width: 50%;
        height: 100%;
    }
    
    .page-fee .fee_list_item_price_color,
    .page-fee .fee_list_item_years_color {
        font-size: 14px;
    }
}

@media screen and ( max-width:414px ) {
    
    .page-fee .fee_list_item_price,
    .page-fee .fee_list_item_years {
        display: block;
    }
    
    .page-fee .fee_list_item_img {
        margin-right: 15px;
    }
    
    .page-fee .fee_list_item_price_color,
    .page-fee .fee_list_item_years_color {
        display: inline-block;
        margin-bottom: 5px;
    }
}


/* 製品・サービス一覧 */

.page-service .service_list {
    margin-bottom: 150px;
}

.page-service .service_list_item {
    display: flex;
    justify-content: space-between;
}

.page-service .service_list_item:first-child {
    flex-flow: row-reverse wrap;
    margin-bottom: 80px;
}

.page-service .service_list_item_details {
    width: 50%;
}

.page-service .service_list_item_ttl {
    font-size: 50px;
    text-align: center;
    line-height: 1;
}

.page-service .service_list_item_txt {
    margin: 30px 0;
}

.page-service .service_list_item_btn {
    position: relative;
    display: block;
    width: 270px;
    padding: 20px;
    padding-left: 15px;
    margin: auto;
    font-size: 20px;
    text-align: center;
    color: #ffffff;
}

.page-service .service_list_item_btn:before {
    position: absolute;
    content: '';
    width: 10px;
    height: 10px;
    margin-top: -6px;
    border-top: solid 2px #ffffff;
    border-right: solid 2px #ffffff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    top: 50%;
    right: 80px;
}

@media screen and (max-width: 768px) {
    
    .page-service .service_list {
        margin-bottom: 65px;
    }
    
    .page-service .service_list_item {
        display: block;
    }
    
    .page-service .service_list_item_details {
        width: 100%;
    }
    
    .page-service .service_list_item_img {
        width: 100%;
        margin-bottom: 25px;
    }
    
    .page-service .service_list_item_btn {
        width: 100%;
        box-sizing: border-box;
    }
    
    .page-service .service_list_item_btn:before {
        right: 20px;
    }
}


/* 製品・サービス一覧 / 外壁塗装 */

.page-works-cld.page-sub .hero {
    /*height: 400px;*/
    background: url(/assets/images/reason/hero.png) no-repeat;
    background-size: cover;
}

.page-paint .works_cld_list_wrap:nth-child(even) {
    padding: 80px 0;
    background: rgba(105,146,37,0.05);
}

.page-reform .works_cld_list_wrap:nth-child(even) {
    padding: 80px 0;
    background: rgba(12,100,138,0.05);
}

.page-works-cld .works_cld_list_wrap:nth-child(odd) {
    margin-bottom: 75px;
}

.page-works-cld .works_cld_list {
    display: flex;
    justify-content: space-between;
}

.page-works-cld .works_cld_list_item_img {
    vertical-align: bottom;
}

.page-works-cld .works_cld_list_item_ttl {
    margin-bottom: 40px;
    font-size: 40px;
}

.page-works-cld .works_cld_list_item_txt {
    margin-right: 65px;
    margin-bottom: 50px;
}

.page-works-cld .works_cld_list_img {
    display: flex;
}

.page-works-cld .works_cld_list_img_item {
    margin-right: 30px;
    vertical-align: bottom;
}

.page-works-cld .more-wrap {
    margin: 90px auto;
}

.page-works-cld .more-wrap-btn {
    display: block;
    width: 550px;
    padding: 40px 0;
    margin: auto;
    text-align: center;
    font-size: 30px;
    color: #ffffff;
    position: relative;
}

.page-works-cld .more-wrap-btn:first-child {
    margin-bottom: 20px;
}

.page-works-cld .more-wrap-btn:after {
    position: absolute;
    content: '';
    width: 10px;
    height: 10px;
    margin-top: -6px;
    border-top: solid 2px #ffffff;
    border-right: solid 2px #ffffff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    top: 50%;
    right: 20px;
}


@media screen and ( max-width:768px ) {
    
    /*.page-works-cld.page-sub .hero {　
        height: 200px;
    }*/
    
    .page-works-cld .works_cld_list {
        display: block;
    }
    
    .page-works-cld .works_cld_list_item_ttl {
        margin-bottom: 25px;
    }
    
    .page-works-cld .works_cld_list_item_txt {
        margin-right: 0;
        margin-bottom: 10px;
    }
    
    .page-works-cld .works_cld_list_item_img {
        width: 100%;
    }
    
    .page-works-cld .works_cld_list_img {
        justify-content: space-between;
        margin-bottom: 35px;
    }
    
    .page-works-cld .works_cld_list_img_item {
        width: 48%;
        height: 100%;
        margin-right: 0;
    }
    
    .page-works-cld .more-wrap-btn {
        width: 100%;
        font-size: 16px;
    }
    
    .page-works-cld .more-wrap-btn:nth-child(2n) {
        padding: 20px 0;
    }
    
}



/* 施工事例 */

.page-works .works_nav {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin: 100px 0 0 0;
}

.page-works .works_nav_item {
    width: 320px;
    margin: 0 20px;
}

.page-works .works_nav_btn {
    color: #fff;
    display: block;
    padding: 25px 0;
    text-align: center;
    font-size: 24px;
    position: relative;
}

.page-works .works_nav_btn:after {
    content: "";
    position: absolute;
    display: block;
    width: 10px;
    height: 10px;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    transform: rotate(45deg);
    right: 30px;
    top: 50%;
    margin: -8px 0 0 0;
}

.page-works .works_nav_btn_paint {
    background-color: #699225;
}

.page-works .works_nav_btn_reform {
    background-color: #0C648A;
}

.page-works .paint_wrap, .page-works .reform_wrap {
    padding-top: 90px;
}

.page-works .works_list_ttl {
    margin-bottom: 20px;
    font-size: 40px;
}

.page-works .works_list_ttl.stg-deep-green {
    border-bottom: 2px solid #699225;
}

.page-works .works_list_ttl.stg-blue {
    border-bottom: 2px solid #0068b7;
}

.page-works .works_list_paint, .page-works .works_list_reform {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.page-works .works_list_paint_item, .page-works .works_list_reform_item {
    width: 48%;
    margin-bottom: 75px;
}

.page-works .works_list_paint_item_img {
    width: 100%;
}

.page-works .works_list_paint_item_ttl {
    padding: 5px 0;
    font-size: 30px;
    border-bottom: 1px solid #699225;
}

.page-works .works_list_reform_item_ttl {
    padding: 5px 0;
    font-size: 30px;
    border-bottom: 1px solid #0068b7;
}

.page-works .works_list_paint_item_txt,
.page-works .works_list_reform_item_txt {
    padding: 20px 0;
}

.page-works .works_fee_details {
    display: flex;
}

.page-works .works_fee_details_name {
    display: inline-block;
    padding: 2px 10px;
    margin-right: 18px;
    color: #fff;
}

.page-works .works_fee_details_price {
    color: #919191;
    font-size: 18px;
    border: 1px solid #919191;
    line-height: 1;
    padding: 4px 10px;
}

@media screen and ( max-width: 768px ) {
    
    .page-works .works_nav {
        margin: 50px 0 0 0;
    }

    .page-works .works_nav_item {
        width: 100%;
        margin: 0 0 15px 0;
    }

    .page-works .works_nav_btn {
        font-size: 16px;
    }
    
    .page-works .paint_wrap,
    .page-works .reform_wrap {
        width: 100%;
        padding-top: 30px;
    }
    
    .page-works .works_list_paint_item,
    .page-works .works_list_reform_item {
        width: 100%;
        margin-bottom: 60px;
    }
    
    .page-works .works_list_ttl {
        font-size: 35px;
    }
    
    .page-works .works_list_paint_item_ttl,
    .page-works .works_list_reform_item_ttl {
        font-size: 25px;
    }
    
    .page-works .works_fee_details_price {
        font-size: 15px;
    }
    
}











