/*! HTML5 Boilerplate v5.2.0 | MIT License | https://html5boilerplate.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

/* html {
    color: #222;
    font-size: 1em;
    line-height: 1.4;
} */

/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */

audio,
canvas,
iframe,
img,
svg,
video {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Browser Upgrade Prompt
   ========================================================================== */

.browserupgrade {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */








/* **************************************************************************
   common
   ************************************************************************** */
html { font-size:13px; line-height:24px; letter-spacing:0px; font-family:'メイリオ', 'Meiryo', 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', sans-serif; }
img { border:none; }
/* a { text-decoration:none; } */
a:hover { opacity:0.75; }
a:hover { opacity:0.75; /*transform:scale(1.0);*/ transition:all .125s ease-in-out; }
/* html, a { color:white; } */
/* html, a { color:#4d4d4d; } */

.gothic { font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'Meiryo', 'メイリオ', sans-serif; }
.mincho { font-family:'ヒラギノ明朝 ProN W6', 'HiraMinProN-W6', 'HG明朝E', 'ＭＳ Ｐ明朝', 'MS PMincho', 'MS 明朝', serif; }

.x { width:100%; overflow:hidden; }
.x .y { width:100%; position:relative; z-index:3; }
.x .y .z { width:100%; margin:auto; position:relative; }

.bgi { background-size:cover; background-position:center; background-repeat:repeat; }

.col3 { width:320px; float:left; }
.col6 { width:640px; float:left; }

.l { width:50%; float:left; }
.r { width:50%; float:right; }

.transition { transition:all .25s ease-in-out; }

/* jQuery mobile */
div.ui-loader { display:none; }

/* form parts normalizer */
textarea,
select,
option,
input[type="text"],
input[type="password"],
input[type="submit"],
input[type="button"] { -o-appearance:none; -ms-appearance:none; -moz-appearance:none; -webkit-appearance:none; appearance:none; margin:0; padding:0; border:0; border-radius:0; font-size:inherit; line-height:normal; letter-spacing:inherit; font-family:inherit; color:inherit; vertical-align:baseline; box-sizing:content-box; position:relative; padding-top:1px; margin-top:-1px; /* rel padding-top */ }
input[type="radio"],
input[type="checkbox"] { margin:0; padding:0; font-size:inherit; line-height:inherit; letter-spacing:inherit; font-family:inherit; color:inherit; vertical-align:middle; box-sizing:content-box; position:relative; top:-2px; }
.select-wrapper { display:inline-block; position:relative; }
.select-wrapper:before { content:'▼'; display:inline-block; position:absolute; z-index:1; right:20px; top:0px; text-align:center; font-size:inherit; line-height:inherit; letter-spacing:inherit; font-family:inherit; color:inherit; }
.select-wrapper > select { background:none transparent; z-index:2; }
select::-ms-expand { display:none; }
/* ie bugfix *//*
input[type="text"],
input[type="password"],
input[type="submit"],
input[type="button"] {
    line-height:normal;
}
*/
/* form parts customizer */
textarea[disabled=disabled],
select[disabled=disabled],
input[disabled=disabled] { background:#d4d4d4; background:rgba(0,0,0,0.125); }
textarea,
select,
input[type="text"],
input[type="password"],
input[type="submit"],
input[type="button"] {
    top:-1px; /*border分*/
    border:1px solid #4d4d4d;
    border-radius:8px;/*0.5rem;*/
    padding-left:0.5rem; padding-right:0.5rem;
    /*width:80px;*/

    border:1px solid transparent;
    background:transparent;
}
.select-wrapper:before { width:1rem; padding-right:0.5rem; }
/* .select-wrapper > select { padding-right:1.5rem;} */
textarea { height:12rem; }
textarea,
select,
input[type="text"],/*
input[type="password"],
input[type="submit"],
input[type="button"],
input[type="radio"],
input[type="checkbox"],*/
.select-wrapper > select {
    background:#e6e6e6;
    /*box-shadow:0px 1px 1px 1px rgba(0,0,0,0.375);*/
}

.select-wrapper {
    border-radius:6px;/*0.5rem;*/
    background-color:#ffffff;/*#efefef;*/
    box-shadow:0 0 0 1px #4d4d4d inset;/*#46aaf3 inset;*//*0px 1px 1px 1px rgba(0,0,0,0.375) inset;*/

    margin-top:1px;
}
.select-wrapper > select {
    background:transparent;
    top:0px;
    margin-top:0;
    padding-right:3rem;
    padding-bottom:1px;
    color:#4d4d4d;/*#46aaf3;*/
}
.select-wrapper:before {
    top:2px;
    border-left:1px solid transparent;/*#ddd;*/
    padding-left:0.5rem;
    padding-right:0.75rem;
    /*content:url(../img/index_nav_select_arrow.png?v=1);*/
    color:#4d4d4d;/*#46aaf3;*/
}
input[type="text"] { background-color:#efefef; box-shadow:0px 0px 1px 0px rgba(229,229,229,1.00) inset; }
input[type="text"]:focus { outline:0; }
/*
.select-wrapper.active,
.select-wrapper.active * {
    color:#ffffff;
    background-color:#46aaf3;
}
*/
.select-wrapper.active {
    background-color:#46aaf3;
}
.select-wrapper.active * {
    color:#ffffff;
}
.select-wrapper.active:before {
    color:#ffffff;
}

/* outline */
.outline {
    filter:dropshadow(color=#000000,offX= 0,offY=-1)
    dropshadow(color=#000000,offX= 1,offY= 0)
    dropshadow(color=#000000,offX= 0,offY= 1)
    dropshadow(color=#000000,offX=-1,offY= 0);

    /*
    -webkit-text-stroke-color: #000;
    -webkit-text-stroke-width: 1px;
    */

    text-shadow: black 1px 1px 0px, black -1px 1px 0px,
                 black 1px -1px 0px, black -1px -1px 0px;

    color:#fff;
}








#inquiry .x.title .y { background-image:url(../img/inquiry_001.jpg); }
#inquiry .x.aaaaaaaa {}
#inquiry .x.aaaaaaaa .y {}
#inquiry .x.aaaaaaaa .y .z {}
#inquiry .x.aaaaaaaa .y .z td { text-align: center; }
#inquiry .x.aaaaaaaa .y .z .d1 { padding:10px; text-align:center; }
#inquiry .x.aaaaaaaa .y .z .d1 .d1-1 { display:inline-block; text-align:left; }
#inquiry .x.aaaaaaaa .y .z .d1 .d1-1 a { text-decoration:underline; }
#inquiry .x.zzzzzzzz { width: 100%;}
#inquiry .x.zzzzzzzz .y {}
#inquiry .x.zzzzzzzz .y .z {}
#inquiry .x.zzzzzzzz .y .z .d1 { padding:0 10px; }
#inquiry .x.zzzzzzzz .y .z table { width:100%; }
#inquiry .x.zzzzzzzz .y .z table tbody tr td { border:1px solid #cbcbcb; border-left:none; border-right:none; vertical-align:top; padding:14px 16px; line-height:38px; }
#inquiry .x.zzzzzzzz .y .z table tbody tr td:first-child { font-weight:bold; }
#inquiry .x.zzzzzzzz .y .z table tbody tr.required {}
#inquiry .x.zzzzzzzz .y .z table tbody tr.required td:first-child span:after { content:'※'; color:red; }
#inquiry .x.zzzzzzzz .y .z table tbody tr.optional {}
#inquiry .x.zzzzzzzz .y .z table tbody tr td input[type=text],
#inquiry .x.zzzzzzzz .y .z table tbody tr td textarea { width:534px; }
#inquiry .x.zzzzzzzz .y .z table tbody tr td select,
#inquiry .x.zzzzzzzz .y .z table tbody tr td input#inquiry-form-zip { width:200px;}
#inquiry .x.zzzzzzzz .y .z table tbody tr td input#inquiry-form-zip1 { width:45px;}
#inquiry .x.zzzzzzzz .y .z table tbody tr td input#inquiry-form-zip2 { width:60px;}
#inquiry .x.zzzzzzzz .y .z table tbody tr.exception1 td { line-height:23px; }
#inquiry .x.zzzzzzzz .y .z table tbody tr.exception2 td { border-bottom:none; }
#inquiry .x.zzzzzzzz .y .z table tbody tr.exception3 td { border-top:none; }
#inquiry .x.zzzzzzzz .y .z table tbody tr.error { background-color:#ffcccc; }
#inquiry .x.zzzzzzzz .y .z .control { padding:60px 0; text-align:center; }
#inquiry .x.zzzzzzzz .y .z .control a { display:inline-block; height:44px; line-height:44px; width:280px; margin:10px; background-color:#347342; color:#fff; font-size:15px; }
#inquiry .x.zzzzzzzz .y .z .note-w { padding:10px 0 40px 0; text-align:center; }
#inquiry .x.zzzzzzzz .y .z .note-w .note-i { display:inline-block; text-align:left; }
#inquiry .x.zzzzzzzz .y .z .note-w .note-i-1 { color:red; }
#inquiry .x.zzzzzzzz .y .z .note-w .note-i a { text-decoration:underline; }


/* 2/4追加 */
/* 1行（2カラム） */
#inquiry .form-row{
    display:flex;
    gap:16px;
    padding:14px 16px;
    border-top:1px solid #cbcbcb;
    line-height:38px;
}

/* 最後の行にも下線を付けたいなら */
#inquiry .form-row:last-child{
    border-bottom:1px solid #cbcbcb;
}
/* 確認画面：お問い合わせ種別の select を “テキスト表示” にする */
#inquiry .is-confirm .select-wrapper{
    background: transparent;
    box-shadow: none;
    border-radius: 0;
}

#inquiry .is-confirm .select-wrapper:before{
    display:none; /* ▼ を消す */
}

#inquiry .is-confirm .select-wrapper > select{
    appearance:none;
    -webkit-appearance:none;
    -moz-appearance:none;

    border:0;
    background:transparent;
    padding:0;
    margin:0;

    pointer-events:none;   /* 開けなくする */
    outline:none;
}

/* 左列：固定幅（元の 180px を再現） */
#inquiry .form-label{
    width:180px;
    font-weight:bold;
}

/* 右列：可変 */
#inquiry .form-field{
    flex:1;
    min-width:0;
}

/* ★ 入力欄サイズ：PC 534px */
#inquiry .form-field input[type="text"],
#inquiry .form-field textarea{
    width:534px;
    max-width:100%; /* 念のためはみ出し防止 */
}
#inquiry .form-field select{
    width:200px;
    max-width:100%; /* 念のためはみ出し防止 */
}

/* 郵便番号の並び */
#inquiry .form-field-zip{
    display:flex;
    align-items:center;
    gap:8px;
}
#inquiry .zip-sep{ padding:0 4px; }

/* ★ 郵便番号：PC ちょうど良いサイズ */
#inquiry .form-field-zip input[type="text"]{
    width:auto;      /* ←上の 534px を打ち消す */
    max-width:none;
}
#inquiry #inquiry-form-zip1{ width:64px; } /* 3桁 */
#inquiry #inquiry-form-zip2{ width:88px; } /* 4桁 */

/* required の※ */
#inquiry .required .form-label span:after{
    content:'※';
    color:red;
    margin-left:4px;
}

/* スマホ：縦並びにする + 入力欄200px */
@media (max-width: 767px){
    #inquiry .form-row{
        flex-direction:column;
        gap:8px;
        line-height:1.8;
    }
    #inquiry .form-label{
        width:100%;
    }
  /* ★ 入力欄サイズ：スマホ 200px */
    #inquiry .form-field input[type="text"],
    #inquiry .form-field textarea{
        width:250px;
    }
    #inquiry .form-field select{
        width:150px;
    }
  /* ★ 郵便番号：スマホで押しやすいサイズ */
    #inquiry #inquiry-form-zip1{ width:72px; }
    #inquiry #inquiry-form-zip2{ width:96px; }
}