@charset "UTF-8";

/*--------------------------
 SECURITY TITLE
----------------------------*/
@media screen and (min-width:768px) and ( max-width:1120px) {
.security_title {
    padding-top: 0px;
}
}
@media screen and (min-width:960px) {
.security_title {
    width: 960px;
    margin-left: auto;
    margin-right: auto;
}
}

.security_title {
    background-color: #4e3827;
    padding-top: 30px;
    padding-bottom: 30px;
    margin-top: 30px;
    text-align: center;
}
.security_title_shoulder {
    font-size: 24px;
    line-height: 42px;
    letter-spacing: 0.05em;
    padding-left: 30px;
}
.security_title_shoulder br {
    display: none;    
}
/*--------------------------
 SECURITY INTER PHONE TITLE
----------------------------*/
@media screen and (min-width:768px) and ( max-width:960px) {
.inph_title_wrapper {
    margin-left: 30px;
    margin-right: 30px;
	margin-top: 40px;
}
}
@media screen and (min-width:960px) {
.inph_title_wrapper {
    width: 960px;
    margin-left: auto;
    margin-right: auto;
	margin-top: 40px;
}
}

.inph_title_wrapper::after {
    content: "";
    display: block;
    clear: both;
}
.inph_title_chars {
    float: left;    
}
.inph_title_copy {
    font-size: 24px;
    line-height: 42px;
    letter-spacing: 0.05em;
    padding-top: 20px;
}
.inph_title_img {
    float: right;
    width: 40%;
}
.inph_title_img img {
    width: 100%;
    height: auto;
}


/*--------------------------
 SECURITY INTER PHONE IMAGE
----------------------------*/
@media screen and (min-width:768px) and ( max-width:960px) {
.inph_image {
    margin-left: auto;
    margin-right: auto;
    margin-top: 40px;
    position: relative;
}
}
@media screen and (min-width:960px) {
.inph_image {
    width: 960px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 40px;
    position: relative;
}
}

.inph_image::after {
    content: "";
    display: block;
    clear: both;
}
.inph_image_left {
    float: left; 
	width: 48%;
}
.inph_image_left img {
    width: 100%;
    height: auto;
}
.inph_image_right {
    float: right;
    width: 48%;
}
.inph_image_right img {
    width: 100%;
    height: auto;
}
.inph_image_pc {
    width: 60px;
    position: absolute;
    top: 40%;
    left: 48%;
}
.inph_image_pc img {
     width: 100%;
    height: auto;
}
.inph_image_xs {
    display: none;   
}
.inph_image_xs img {
    width: 60px;
    height: auto;
}
/*--------------------------
 SECURITY INTER PHONE POINT
----------------------------*/
@media screen and (min-width:768px) and ( max-width:960px) {
.inph_point {

    margin-left: 20px;
    margin-right: 20px;
    margin-top: 40px;
    position: relative;
}
}
@media screen and (min-width:960px) {
.inph_point {
    width: 960px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 40px;
    position: relative;
}
}
.inph_point::after {
    content: "";
    display: block;
    clear: both;
}

.inph_point li {
    border: 3px solid #d8e1db;
    width: 48%;
    float: left;
    margin-right: 2.2%;
    margin-bottom: 2%;
    padding-top: 30px;
    padding-bottom: 30px;
    position: relative;
}
.inph_point li:nth-child(2n) {
    margin-right: 0%;
}

.inph_point_shoulder {
    font-size: 20px;
    line-height: 30px;
    letter-spacing: 0.05em;
    color: #2d6d48;
    
}

@media screen and (min-width:768px) and ( max-width:960px) {
.inph_point_p {
    padding-right: 40px;
}
}
@media screen and (min-width:960px) {
.inph_point_p {
    width: 220px;
}
}
.inph_point_p {
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0.05em;
    padding-top: 15px;
    padding-bottom: 20px;
}

.inph_point_cener {
    text-align: center;    
}

.inph_point_renzoku {
    font-size: 22px;
    line-height: 34px;
    letter-spacing: 0.05em;
    padding-top: 15px;
    background-color: #d8e1db;
    padding-bottom: 15px;
    margin-left: 30px;
    margin-right: 30px;
    margin-top: 20px;
}

.inph_point_chars {
    padding-left: 40px;
}

@media screen and (min-width:768px) and ( max-width:960px) {
.inph_point_illust {
    width: 140px;
    height: auto;
    margin-left: auto;
    margin-right: auto;

}
}
@media screen and (min-width:960px) {
.inph_point_illust {
    width: 140px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    top: 80px;
    right: 20px;
    position: absolute; 
}
}
.inph_point_illust {
    width: 140px;
    height: auto;
    margin-left: auto;
    margin-right: auto;


    
}
.inph_point_illust img {
    width: 100%;
    height: auto;
	
}





/*--------------------------
 SECURITY SUB TITLE
----------------------------*/
.security_sub_title {
    font-size: 28px;
    line-height: 32px;
    margin-top: 80px;
    letter-spacing: 0.05em;
    background-color: #FFFFFF;
    position: relative;
    text-align: center;
    margin-bottom: 90px;
}
.security_sub_title br {
    display: none;    
}


/*--------------------------
 SAFTY SYSTEM
----------------------------*/
@media screen and (min-width:768px) and ( max-width:960px) {
.safety_system {
    margin-top: 40px;
    position: relative;
	margin-left: 20px;
    margin-right: 20px;
	 border: 3px solid #d8e1db;
}
}
@media screen and (min-width:960px) {
.safety_system {
    width: 960px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 40px;
    position: relative;
	 border: 3px solid #d8e1db;
}
}
.safety_system::after {
    content: "";
    display: block;
    clear: both;
}

@media screen and (min-width:768px) and ( max-width:960px) {
.safety_system_left {
	padding-left: 30px;
    padding-right: 30px;
    padding-top: 30px;
    padding-bottom: 20px;
}
}
@media screen and (min-width:960px) {
.safety_system_left {
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 40px;
    padding-bottom: 20px;
    
}
}

@media screen and (min-width:768px) and ( max-width:960px) {
.safety_system_left_img {
    height: auto;
    margin-left: auto;
    margin-right: auto;
    max-width: 400px;
}
}
@media screen and (min-width:960px) {
.safety_system_left_img {
    width: 40%;
    height: auto;
    margin-left: auto;
    margin-right: auto;
	position: absolute;
    top: 50px;
    right: 30px;
}
}

.safety_system_left img {
    width: 100%;
    height: auto;
}

@media screen and (min-width:768px) and ( max-width:960px) {
.safety_system_right {

	padding-left: 30px;
    padding-right: 30px;
    padding-top: 30px;
    padding-bottom: 20px;
	border-top: 1px dotted #959595;
}
}
@media screen and (min-width:960px) {
.safety_system_right {
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 40px;
    padding-bottom: 20px;
	border-top: 1px dotted #959595;
    
}
}

.safety_system_right img {
    width: 100%;
    height: auto;
}
.safety_system_chars {
    margin-bottom: 30px;  
}
.safety_system_copy {
    font-size: 20px;
    line-height: 32px;
    letter-spacing: 0.02em;
    color: #2d6d48;
    padding-bottom: 20px;
}
.safety_system_p {
    font-size: 15px;
    line-height: 26px;
}
@media screen and (min-width:768px) and ( max-width:960px) {
.safety_system_p_frame {
   
}
}
@media screen and (min-width:960px) {
.safety_system_p_frame {
    width: 50%;    
}
}

.safety_system_desc {
    font-size: 10px;
    line-height: 16px;
    display: block;
    padding-top: 10px;
}


/*--------------------------
 SECURITY KEIBI
----------------------------*/
@media screen and (min-width:768px) and ( max-width:960px) {
.security_keibi {
    margin-top: 20px;
    position: relative;
	margin-left: 20px;
    margin-right: 20px;
}
}
@media screen and (min-width:960px) {
.security_keibi {
    width: 960px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    position: relative;
}
}
.security_keibi::after {
    content: "";
    display: block;
    clear: both;
}

.security_keibi_wrap {
    border: 3px solid #d8e1db;
	padding-left: 40px;
    padding-right: 40px;
    padding-top: 40px;
    padding-bottom: 40px;
}
.security_keibi_pc {
    margin-top: 30px;
}
.security_keibi_pc img {
    width: 100%;
    height: auto;
}
.security_keibi_xs {
    display: none;   
}
.security_keibi_xs img {
    width: 100%;
    height: auto;
}


/*--------------------------
 SECURITY CARD KEY
----------------------------*/
.card_wrapper {
    
}
@media screen and (min-width:768px) and ( max-width:960px) {
.key_readcopy_wrapper {
    margin-left: 30px;
    margin-right: 30px;
	margin-top: 40px;
	position: relative;
}
}
@media screen and (min-width:960px) {
.key_readcopy_wrapper {
    width: 960px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 40px;
    position: relative;

}
}

.key_readcopy_wrapper::after {
    content: "";
    display: block;
    clear: both;
}

@media screen and (min-width:768px) and ( max-width:960px) {
.key_readcopy_p {
    font-size: 16px;
    line-height: 28px;
    width: 80%;
	padding-bottom: 20px;
}
.key_readcopy_p br {
    display: none;    
}
}
@media screen and (min-width:960px) {
.key_readcopy_p {
    font-size: 16px;
    line-height: 28px;
    width: 80%;
    padding-bottom: 20px;
}
}

@media screen and (min-width:768px) and ( max-width:960px) {
.key_readcopy_logo {
    width: 60px;
    position: absolute;
    top: 0px;
    right: 20px;
}
}
@media screen and (min-width:960px) {
.key_readcopy_logo {
    width: 60px;
    position: absolute;
    top: -120px;
    right: 20px;
}
}

.key_readcopy_logo img {
    width: 100%;
    height: auto;
}


/*--------------------------
 CARD
----------------------------*/
@media screen and (min-width:768px) and ( max-width:960px) {
.card_LR_wrapper {
    margin-left: 20px;
    margin-right: 20px;
	margin-top: 20px;
	position: relative;
}
}
@media screen and (min-width:960px) {
.card_LR_wrapper {
    width: 960px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    position: relative;

}
}
.card_LR_wrapper::after {
    content: "";
    display: block;
    clear: both;
}


@media screen and (min-width:768px) and ( max-width:960px) {
.card_L {
    width: 43%;
    float: left;
	border: 3px solid #d8e1db;
	padding-left: 20px;
    padding-right: 20px;
    padding-top: 20px;
    padding-bottom: 20px;
}
.card_R {
    width: 43%;
    float: right;
	border: 3px solid #d8e1db;
	padding-left: 20px;
    padding-right: 20px;
    padding-top: 20px;
    padding-bottom: 20px;
}
}
@media screen and (min-width:960px) {
.card_L {
    width: 40%;
    float: left;
	border: 3px solid #d8e1db;
	padding-left: 40px;
    padding-right: 40px;
    padding-top: 40px;
    padding-bottom: 40px;
}
.card_R {
    width: 40%;
    float: right;
	border: 3px solid #d8e1db;
	padding-left: 40px;
    padding-right: 40px;
    padding-top: 40px;
    padding-bottom: 40px;
}
}

@media screen and (min-width:768px) and ( max-width:960px) {
.card_L02 {
    width: 51%;
    float: left;
	border: 3px solid #d8e1db;
	padding-left: 20px;
    padding-right: 20px;
    padding-top: 20px;
    padding-bottom: 20px;
}
.card_R02 {
    width: 34%;
    float: right;
	border: 3px solid #d8e1db;
	padding-left: 20px;
    padding-right: 20px;
    padding-top: 20px;
    padding-bottom: 20px;
}
}
@media screen and (min-width:960px) {
.card_L02 {
    width: 51%;
    float: left;
	border: 3px solid #d8e1db;
	padding-left: 40px;
    padding-right: 40px;
    padding-top: 40px;
    padding-bottom: 30px;
}
.card_R02 {
    width: 29%;
    float: right;
	border: 3px solid #d8e1db;
	padding-left: 40px;
    padding-right: 40px;
    padding-top: 40px;
    padding-bottom: 30px;
}
}



.card_choulder {
    font-size: 20px;
    line-height: 32px;
    letter-spacing: 0.02em;
    color: #2d6d48;
    padding-bottom: 20px;
}
.card_p {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0.02em;
    padding-bottom: 30px;
}
.card_img01 {
    width: 200px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
}
.card_img01 img {
    width: 100%;
    height: auto;
}
/*--------------------------
 AFTER SERVICE
----------------------------*/
.after_icon {
    margin-bottom: -10px;      
}
.after_icon li {
    margin-bottom: 20px;
    font-size: 14px;
    line-height: 26px;
    min-height: 50px;
}
.after_icon li p {
    margin-left: 70px;
    margin-top: -52px;
}
.after_icon li img {
    width: 50px;
    height: auto;
}

@media screen and (min-width:768px) and ( max-width:1120px) {
.after_icon_call {
    width: 300px!important;

    margin-top: 15px;
}
.after_icon_call img {
    width: 100%!important;
    height: auto!important;
}
}
@media screen and (min-width:1120px) {
.after_icon_call {
    width: 300px!important;
    margin-left: 70px;
    margin-top: 10px;
}
.after_icon_call img {
    width: 100%!important;
    height: auto!important;
}
}

/*--------------------------
 SECURITY ENTRANCE
----------------------------*/
.entrance_wrapper {
   
}
.entrance_wrapper::after {
    content: "";
    display: block;
    clear: both;
}
.entrance_chars {
    padding-bottom: 10px;
    float: left;
    width: 50%;
}
.entrance_copy {
    font-size: 20px;
    line-height: 32px;
    letter-spacing: 0.02em;
    color: #005EAC;
    padding-bottom: 20px;
}
.entrance_p {
    font-size: 15px;
    line-height: 26px;
}
.entrance_image {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 10px;
    float: right;
	width: 45%;
}
.entrance_image img {
    width: 100%;
    height: auto;
}

.entrance_sub {
    font-size: 16px;
    line-height: 28px;
    letter-spacing: 0.02em;
    padding-bottom: 10px;
	color: #2d6d48;
}
.entrance_sub span {
    color: #2d6d48;
    padding-right: 7px;
}
.entrance_p_sub {
    font-size: 14px;
    line-height: 24px;
}
.entrance_p_desc {
    font-size: 10px;
    line-height: 16px;
    padding-bottom: 0px;
    padding-top: 20px;
}

/*--------------------------
 SECURITY 3
----------------------------*/
@media screen and (min-width:768px) and ( max-width:960px) {
.security_three_wrapper {
    margin-left: 20px;
    margin-right: 20px;
}
}
@media screen and (min-width:960px) {
.security_three_wrapper {
    width: 960px;
    margin-left: auto;
    margin-right: auto;
}
}

.security_three {
    margin-top: 30px;
    margin-bottom: 30px;
}
.security_three::after {
    content: "";
    display: block;
    clear: both;
}
.security_three li {
    width: 31%;
    margin-right: 3.5%;
    float: left;
    padding-bottom: 50px;
}
.security_three li:nth-child(3n) {
    margin-right: 0%;
}
.security_three li img {
    width: 100%;
    height: auto;
}
@media screen and (min-width:768px) and ( max-width:960px) {
.kitchen_four figcaption {
    padding-top: 20px;
}
.security_three_title {
    font-size: 16px;
    line-height: 28px;
    letter-spacing: 0em;
    padding-bottom: 10px;
    color: #2d6d48;
    padding-top: 15px;
}
.security_three_p  {
    font-size: 13px;
    line-height: 20px;
    background-image: url(../images/security_circle_blue.svg);
    background-repeat: no-repeat;
    background-position: left top 10px;
    background-size: 3px auto;
    padding-left: 10px;
	padding-bottom: 3px;
}
.security_three_caution  {
    font-size: 10px;
    line-height: 20px;
    padding-left: 12px;
}
}
@media screen and (min-width:960px) {
.security_three figcaption {
    padding-top: 20px;
}
.security_three_title {
    font-size: 18px;
    line-height: 28px;
    letter-spacing: 0.02em;
    padding-bottom: 15px;
    color: #2d6d48;
}
.security_three_p  {
    font-size: 14px;
    line-height: 20px;
    background-image: url(../images/security_circle_blue.svg);
    background-repeat: no-repeat;
    background-position: left top 10px;
    background-size: 3px auto;
    padding-left: 8px;
    padding-bottom: 3px;
}
.security_three_caution  {
    font-size: 10px;
    line-height: 20px;
    padding-left: 12px;
}
}