@charset "UTF-8";
/* ======================================== 
 sp
==========================================*/
.privacy-in { background:#fff; border:1px solid #ccc;}

.contact .social-items {margin: 0 auto 10vw;}
.contact .social-items li{position: relative;transition : .5s;width: 100%;margin: 0 auto 4vw;font-size: 4.2vw;text-align: center;font-family:"Cormorant Infant";font-feature-settings: "palt";letter-spacing: .04em;font-weight: bold;border-radius: 60px;}
.contact .social-items li:after {content: "\f105";font-family: icon;font-size: 88%;display: inline-block;position: absolute;top: 50%;right: 16px;transform: translate(-50%, -50%);-webkit-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);}
.contact .social-items li.line{border:1px solid #7eb790; }
.contact .social-items li.hpb{border:1px solid #c6829b; }
.contact .social-items li.insta{border:1px solid #a89cbf; }
.contact .social-items li.tiktok{border:1px solid #7F7F80; }
.contact .social-items li.line a,.contact .social-items li.line:after {color: #7eb790;}
.contact .social-items li.hpb a,.contact .social-items li.hpb:after {color: #c6829b;}
.contact .social-items li.insta a,.contact .social-items li.insta:after {color: #a89cbf;}
.contact .social-items li.tiktok a,.contact .social-items li.tiktok:after {color: #7F7F80;}
.contact .social-items i { margin-right: 5px;}
.contact .social-items li a {display: block;padding: 3.8vw 0;}
.contact .social-items li a:hover {color:#fff;}
.contact .social-items li:hover { transition : .5s;}
.contact .social-items li.line:hover{background: #7eb790; color: #fff;}
.contact .social-items li.hpb:hover{background: #c6829b; color: #fff;}
.contact .social-items li.insta:hover{background: #a89cbf; color: #fff;}
.contact .social-items li.tiktok:hover{background: #7F7F80; color: #fff;}
.contact .social-items li:hover:after { opacity: 0.8; color:#fff;}


/* =============================================
pc
================================================*/
@media screen and (min-width: 736px) { 
.contact .social-items {margin: 0 auto 60px; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap;align-items:center;justify-content:center;}
.contact .social-items li{width: 23%;font-size: 18px;margin: 0 10px;}
.contact .social-items li a{padding: 20px;}
.contact .social-items i { margin-right: 5px;}

.tel:before{ margin-right: 10px;}

}