@charset "UTF-8";

.contact-box{margin: 0 auto 16vw;}
.contact-box ul { width: 90vw; margin: 0 auto ; }
.contact-box li { width: 100%; margin-bottom: 4vw; text-align: center; background: #fff; -moz-box-shadow: 0 0 8px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.1); box-shadow: 0 0 8px rgba(0, 0, 0, 0.1); }
.contact-box li.web .title { color: var(--naby); }
.contact-box li.web .title:before { content: '\e922'; margin-right: 1vw; font-size: 85%; font-family: 'icon'; font-weight: normal; position: relative; top: -0.4vw; display: inline-block; }
.contact-box li.tel .title { color: #c39d49; font-family: futura-pt; font-weight: 500;  letter-spacing: 0.04em; }
.contact-box li.tel .title:before { content: '\f095'; margin-right: 0.5vw; font-size: 80%; font-family: 'icon'; font-weight: normal; display: inline-block; }
.contact-box li.line .title { color: #609f3e; }
.contact-box li.line .title:before { content: '\e906'; margin-right: 1vw; font-size: 85%; font-family: 'icon'; font-weight: normal; position: relative; top: -0.5vw; display: inline-block; }
.contact-box a { padding: 6vw 0; }
.contact-box .title {margin-bottom: 1.5vw;font-size: 5.8vw;font-weight: bold;display: block;line-height: 1.2;}
.contact-box .sub { font-size: 3.4vw; display: block; }



/* ============================================= 
pc
================================================*/
@media screen and (min-width: 736px) { 

.contact-box {margin: 0 auto 100px;}
.contact-box ul { width: 100%; margin: 0 auto; display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-justify-content: space-between;-ms-flex-pack: justify;justify-content: space-between;-webkit-align-items: flex-start;-ms-flex-align: start;align-items: flex-start;-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;flex-wrap: wrap; }
.contact-box li { width: 32%; margin: 0; }
.contact-box li.web .title:before { margin-right: 8px; top: -1px; }
.contact-box li.tel .title { font-size: 28px; }
.contact-box li.tel .title:before { margin-right: 4px; }
.contact-box li.line .title:before { margin-right: 6px; font-size: 95%; top: -1px; }
.contact-box a { padding: 30px 0; }
.contact-box .title { margin-bottom: 12px; font-size: 26px; }
.contact-box .sub { font-size: 14px; }
	


.formbox{width: 100%;}

}

/* =============================================
retina用
================================================*/
@media screen and (min-width: 736px) and (-webkit-min-device-pixel-ratio: 2), screen and (min-width: 736px) and (min-resolution: 2dppx) { 


}
