@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;700&display=swap');

@media (max-width: 768px) {
    select {
      width: 100%; /* モバイルではプルダウンの幅を親要素に合わせる */
    }
}

body {
    font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}

.btn {
    width: 100%;
    /* �����������Ŏw�� */
}

.free .col {
    padding: 0 0px;
}

.homebtn {
    width: 40%;
    /* �����������Ŏw�� */
}

td {
    font-size: 12px;
}

iframe {
    width: 100%;
    height: 100%;
    border: 1px solid #CCC;
}

iframe {
    border: none;
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
}

.font_top {
    font-size: 250%;
    /* �����T�C�Y�w�� */
    color: navy;
    /* �����F�w�� */
}

.font_title {
    font-size: 15px;
    /* �����T�C�Y�w�� */
}

.font_topfont {
    font-size: 20px;
    /* �����T�C�Y�w�� */
    color: navy;
    /* �����F�w�� */
}

.col {
    width: 100%;
    height: 100%;
}

/* input:placeholder-shown {
    background-color: white;
} */

/* input:not(:placeholder-shown) {
    background-color: #E8F0FE;
} */

.alert {
    color: red;
    text-align: left !important;
}

.select2-container .select2-selection--single {
    text-align: left; /* 選択部分の文字を左寄せ */
    height: calc(1.5em + .75rem + 2px); /* Bootstrapのform-controlの高さに合わせる */
    padding: .375rem;
    border: 1px solid #ced4da;
    border-radius: .375rem;
    box-shadow: inset 0 1px 2px rgba(0,0,0,.075);
}

.select2-container--default .select2-results__option {
    text-align: left; /* ドロップダウンのオプションの文字を左寄せ */
}

.select2-dropdown {
    max-height: 400px;  /* 最大高さを設定 */
    overflow-y: auto;   /* 縦方向のスクロールを有効化 */
}

/* スライダーエリアの最大幅を設定 */
.sliderArea {
    max-width: 100%; /* スライダーの最大幅を調整 */
    margin: 0 auto; /* 中央寄せ */
}

/* メインスライダー内の画像のサイズを制限 */
.slider_thumb img, video {
    width: 100%; /* スライダーの幅に画像がフィットするように */
    height: auto; /* アスペクト比を保ったまま高さを自動調整 */
    /* max-height: 400px; 必要に応じて画像の最大高さを設定 */
}

/* サムネイル画像のサイズを制限 */
.thumb img, video {
    width: 100%; /* サムネイルの幅 */
    height: auto; /* サムネイルの高さはアスペクト比を保つ */
    object-fit: cover; /* 画像がサムネイルにフィットするように切り抜き */
    padding: 5px;
}

/* スライダー下部のサムネイルの配置を調整 */
.thumb {
    margin-top: 20px; /* スライダーとサムネイルの間にスペースを追加 */
    padding-top: 10px;
    padding-bottom: 10px;
    border-top: solid;
    border-bottom: solid;
    border-color: lightgray;
}

.mypage_input {
    width: 100%;
    max-width: 100%;
}

.mypage_input input {
    width: 50%;
    max-width: 50%;
    box-sizing: border-box;
}



.form-group {
    margin: 15px 0;
  }

.form-group label {
    text-align: left;
    display: block;
    font-weight: bold;
    margin-bottom: 5px;
}

.form-group textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 1rem;
}

.form-group textarea {
    resize: none;
    height: 200px;
}
