@charset "utf-8";

/* CSS Document */
/*----------------------------------------------------------------------------
***                                                             headerArea
----------------------------------------------------------------------------*/
body{border-top: none;}
#wrap{width: 100%;}
#headerArea{background: #fff;height: auto;}
#headerArea .logoBox{max-width:1000px ;margin: auto;padding: 10px 0 0;}
#headerArea .logoBox .logo img{width: 22%;height: auto;}

.contentsArea{background-image: url(/lp/novausagi_family/images/bg_img.jpg);background-position: top center;background-size: cover;padding: 0px 0 10px;}
.contentsArea .main-ttlBox{background:#e87e92;padding: 15px;}
.contentsArea .family-listSec{margin: 60px auto;max-width: 1300px;}
.contentsArea .family-listSec .ttlBox p{font-size: 35px;font-weight: 500;}
.contentsArea .family-listSec .family-listBox{margin-top: 2em;}
.contentsArea .family-listSec .family-listBox .family-Ul{gap: 0.5em;}
.contentsArea .family-listSec .family-listBox .family-Ul.usagi{margin-bottom: 1em;}
.contentsArea .family-listSec .family-listBox .family-Ul .popup{margin: auto;width: 201px;cursor: pointer;}
/* .contentsArea .family-listSec .family-listBox .family-Ul .popup:hover{transform: rotateY(360deg);transition: transform 0.5s ease;} */
.contentsArea .family-listSec .family-listBox .family-Ul .popup:hover{transform: scale(1.2);transition: transform 0.5s ease;}
.contentsArea .family-listSec .family-listBox .family-Ul .popup.pinkusagi{width: 218px;}

.popupStyle{box-sizing:border-box; width:600px; height:auto; position:fixed; z-index:999999; padding:2em; display:none; box-shadow:0px 0px 5px 3px rgba(0,0,0,0.2);background: #fff;border-radius: 20px;}
.popupStyle .name{font-size: 18px;line-height: 1.3;}
.popupStyle .name span{display: block;font-size: 80%;}
.popupStyle .profileBox{width: 95%;margin: auto;}
.popupStyle .profileBox dl{margin-bottom: 1em;}
.popupStyle .profileBox dt{font-size: 18px;color: #e87e92;font-weight: bold;}
.popupStyle .profileBox dd{font-size: 15px;line-height: 1.5;}
.popupStyle .phonicsBox{border-top: 1px solid #e87e92;padding-top: 1em;}
.popupStyle .phonicsBox p{color: #e87e92;font-size: 16px;font-weight: bold;padding: 0;}
.popupStyle .phonicsBox .phonics-img img{width: 50%;height: auto;filter: drop-shadow(0px 0px 5px #ccc);}
.popupStyle .phonicsBox .YouTube{margin-top: 1em;}
.popupStyle .phonicsBox .YouTube iframe{width:458px;height: 252px;max-width: 100%;}
.popupStyle .btnClose{width:30px; position:absolute; top:15px; right:25px; cursor:pointer;}
.popupStyle .btnClose2{display: none;}
#modal-overlay{z-index: 999;display: none;position: fixed;top: 0;left: 0;width: 100%;height: 120%;}

.contentsArea .snsSec{margin: 40px auto;max-width: 1000px;}
.contentsArea .snsSec .snstxt{font-size: 25px;font-weight: bold;color: #e87e92;    -webkit-text-stroke: 8px #ffffff;paint-order: stroke fill;stroke-linejoin: round;}
.contentsArea .snsSec .snsBox li{margin: 10px;}