p {
    font-family: "Sawarabi Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
    color: #2d3d77;
}


section {
    width: 1188px;    /* ここを変更する時は中の要素のwidthやmargin計算をし直す必要あり */
    margin: 0 auto;
    margin-bottom: 50px;
}

/********************************
  ヒーローヘッダー画像レスポンシブ
*********************************/
#bg {
    background: url(../img/mehendi/01_main_1348_400.jpg) no-repeat;
    background-size: 100% auto;
    position: relative;
    width: 100%;
    height: auto;
}
#bg:before {
    content: "";
    display: block;
    padding-top: 29.67359050445104%;  /* 画像の高さ/幅*100 */  
}
#bg .inner {
    position: absolute;
    top: 0; 
    left: 0;
    width: 100%;
    height: 100%;
}
#bg .center {
	position: relative;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
}
/********************************
  ヒーローヘッダー画像レスポンシブ ここまで
*********************************/
.me_main {
    text-align: center;
    font-family: sans-serif;
    font-weight: 700;
    font-size: 100px;
    font-size: 6.25rem;
    color: rgba(255, 255, 255, 0.5); 
}

.me {
    font-size: 25px;
    font-size: 1.5625rem;
    text-align: center;
    margin: 2.22551%;
    font-weight: 800;
    color: #2d3d77;
}

.me_02 {
    text-align: center;
    margin-bottom: 10px;
    width: 800px;
    width: 67.34006734006734%;  /* 800/1188 */
    margin: 0 auto;
}

#mehendi, #henna {
    margin: 70px 0;
}

.nanoha {
    float: left;
    width: 29.04040404040404%;   /* 345/1188 */
    margin-right: 6.986531986531987%;   /* 83/1188 */
}

.me_04 {
/*    margin-right: 80px;*/
/*    margin-right: 5.93471%;*/
    float: left;
    width: 760px;
    width: 63.97306397306397%;  /* 760/1188 */
}
section h1 {
    font-size: 20px;
    font-size: 1.25rem;
    color: #2d3d77;
}

hr {
    height: 5px;
    background-color: darkkhaki;
/*    width: 750px;*/
    width: 98.68421%;
    border: none;
/*    margin-left: 0px;*/
    margin-left: 0%;

}

footer {
    margin-top: 0;
}

/********************************
  レスポンシブ
*********************************/
@media screen and (max-width:1200px) {
    section {
        width: auto;
    }
}
@media screen and (max-width:900px){
    .me_02 {
        width: auto;
    }
    .nanoha, .me_04 {
        float: none;
        width: auto;
        text-align: center;
    }
    .nanoha {
        margin-bottom: 10px;
        margin-right: 0;
    }
}
@media screen and (max-width:768px){
    .me_main {
        font-size: 3.75rem; /* 60px */
    }
}
@media screen and (max-width:480px){
}
