/*-------------------------
  【style.css】：全ページに適用しているCSS
-------------------------*/
@charset "utf-8";

/* 画面幅指定*/
.layout{
    position: relative;
    width: auto;
    margin-left: auto;
    margin-right: auto;
}

@font-face{
    font-family: "ほのか丸ゴシック";
    src: url("./font_1_honokamarugo_1.1.ttf") format("truetype")
}

/*見出し色*/
.col{
    color: white;
    font-family: Yu Gothic;
}

/* 使い方本文 */
.howto-text{
    font-size: clamp(15px,6vw,18px);
}

/* 利用例部分の画像 */
.use-example{
    object-view-box: inset(50px 250px 450px 250px);
    background-color :#ffffff;
    object-fit: cover;
    border-radius: 50%;
    border: solid 2px #c0c0c0;
}

.use-example_w{
      object-view-box: inset(150px 200px 220px 180px);
      background-color :#ffffff;
      object-fit: cover;
      border-radius: 50%;
      border: solid 2px #c0c0c0;
}

/* FAQボタン pc*/
.button1{
    border-radius: 500px;
    font-size: 18px;
    height: 45px;
    width: 170px;
    color: rgb(0, 107, 84);
    border: 1px solid rgb(0, 107, 84);
    background-color:  #ffffff;
}
.button1:hover{

    color: white;
    border: 1px solid rgb(93, 181, 36);
    background-color: rgb(28, 166, 141);

}
/* ページトップへ戻るボタン pc*/
.buttonTop{
    padding: 3px;
    border-radius: 500px;
    font-size: 20px;
    height: 45px;
    width: 215px;
    color: rgb(0, 107, 84);
    border: 1px solid rgb(0, 107, 84);
    background-color:  #ffffff;
}
.buttonTop:hover{

    color: white;
    border: 1px solid rgb(0, 107, 84);
    background-color: rgb(28, 166, 141);

}
/* FAQ注意書き枠 */
.box{
    border: 1px solid rgb(0, 107, 84);
}

/* FAQカードサイズ指定 */
.card-size{

    width: 474.5px;
}

/* 利用規約、プライバシーポリシー */
.policy{
    font-size: clamp(14px,1.3vw,16px);
}
.policy > h4{
    margin: 0;
}
.policy > p{
    white-space: pre-line;
    margin:0 0 2.5vh 0;
}

/* のぞいてみるボタン pc*/
.buttonPeek{
    padding: 3px;
    border-radius: 500px;
    font-size: 20px;
    height: 45px;
    width: 80%;
    color: rgb(0, 107, 84);
    border: 1px solid rgb(0, 107, 84);
    background-color:  #ffffff;
    font-size: clamp(17px, 1.3vw, 20px);
}

/* 緊急配信メッセージ pc*/
#emagency{
    padding-top:20px;
    padding-bottom:20px;
}