.subbox {
    display:none;
}

div.kai {
    max-width:940px;
    margin: 0 auto;
    padding:2rem 3rem;
    border: 1px solid #9f886b;
    background: #fafafa;
}
.kai h4,
.cen.dai.res-glass-name {
    font-size:24px;
    text-align: center;
    color: #6a0016;
    background: none;
    padding-bottom: 1.5rem;
    border-radius: 0;
    border-bottom:1px solid #6a0016;
}
.pulldownset p {
    margin: 1rem auto;
    width: 100%;
}
.pulldownset {
    display: flex;
    flex-wrap:wrap;
    justify-content:center;
    border-bottom:1px solid #6a0016;
    padding-bottom: 1.5rem;
}
.pulldownset .mainselect {
    width: 60%;
    text-align: center;
    margin-right: 1rem;
}
.pulldownset .subbox {
    width: 28%;
    text-align: center;
}
/* フォーム全体のラッパーに対して指定 */
.glass-calc-wrapper select {
   background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="%23666666" d="M6 8h12L12 18z"/></svg>');
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 20px; /* 縦長に見える場合はここを少し小さくすると調整しやすいです */
    padding-right: 30px !important;
    border: 1px solid #ccc;
    background-color: #fff;
}

.glass-calc-wrapper input[type="number"],
.glass-calc-wrapper input[type="text"] {
    height: 36px;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 0 8px;
    vertical-align: middle;
    margin-bottom: 0;
}
.naka {
    display: flex;
    align-items: center;
    justify-content: center;
}
.naka input {
    width: 30% !important;
    margin: 0 1rem !important;
}
.naka span {
    font-size: 30px;
    display: inline-block;
    margin: 0 1rem;
}
/* Style for the submit button */
input.calc-exec-btn {
  padding: 10px 20px; /* Set padding */
  border: none; /* Remove border */
  border-radius: 25px; /* Optional: for rounded corners */
  background-color: #6a0016; /* Set background color */
  color: #fff; /* Set text color */
  font-size: 16px; /* Set font size */
  cursor: pointer; /* Set cursor to pointer */
  transition: background-color 0.3s; /* Optional: for smooth color transition */
  text-align: center;
  margin:2rem auto 0;
  display: block;
  width: 90%;
  max-width:320px;
}

/* Hover State */
input.calc-exec-btn:hover {
  background-color: #900520; /* Darken background color when hovered */
}

/* Active State */
input.calc-exec-btn:active {
  background-color: #900520; /* Darken background color when active */
}

/* Focus State */
input.calc-exec-btn:focus {
  outline: none; /* Remove outline */
  box-shadow: 0 0 0 2px rgba(88, 3, 21, 0.5); /* Add a soft outline */
}
@media screen and (max-width: 1200px) {

    
}
@media screen and (max-width: 990px) {


}
@media screen and (max-width: 480px) {
.kai h4,
.cen.dai.res-glass-name {
    font-size: 18px;
}
div.kai {
    padding: 1rem 1.5rem;
}
.pulldownset {
    flex-direction: column;
    align-items: center;
}
.pulldownset .mainselect {
    width: 90%;
    margin-right: 0;
}
.pulldownset .subbox {
    width: 50%;
}
.glass-calc-wrapper input[type="number"],
.glass-calc-wrapper input[type="text"],
.naka span {
    margin:0 .3rem !important;
}
.naka span  {
    font-size:18px;
}

.naka input {
    width: 25% !important;
}
}

/*結果画面*/
ul.flex {
    display: flex;
    padding-left: 0;
    justify-content: center;
    list-style: none;
}
.ume {
    color: #6a0016;
    font-size: 150%;
    font-weight: bold;
    display: inline-block;
    padding: 0 .3rem;
    width: fit-content;
    margin: 0 .5rem;
}
.flex li {
    margin:0 1rem;
    font-size:18px;
}
.cen.go {
    background: #FFF;
    border: 1px solid #d5d5d5;
    text-align: center;
    width: fit-content;
    padding:.5rem;
    margin: 0 auto;
    max-width:400px;
    width: 100%;
    letter-spacing:1px;
}
.cen.go .res-d {
    color: #6a0016;
    font-size: 150%;
    display: inline-block;
    padding: 0 4px;
    font-weight: bold;
}
.cen.cco {
    font-size: 90%;
    text-align: center;
    color: #585858;
    margin-top: 1rem;
}
.res-glass-name-sub-wrap {
    font-size:18px;
}
.res-glass-name-sub {
    display: block;
}
.res-link-block {
    text-align: center;
    border-top:1px solid #6a0016;
    padding-top: 1rem;
}
p:has(.res-link-url) {
    margin-bottom: 0;
}
.res-link-url {
    display: block;
    background: #6a0016;
    color: #FFF;
    width: 100%;
    padding:.5rem;
    max-width:400px;
    margin:1rem auto 0;
    border-radius:4px;
    position: relative;
}
.res-link-url:after {
 font-family: "Material Symbols Outlined";
  content: "\e5cc";
  font-size:20px;
  top: 20%;
  position: absolute;
  right:10%;
  transition: .3s all;
}
.res-link-url:hover {
    color: #FFF;
}
.res-link-url:hover:after {
  right:7%;
}
.calc-reset-btn {
    max-width: 240px;
    border-radius: 50px;
    text-align: center;
    color: #6a0016;
    margin: 1.5rem auto 1rem;
    display: block;
    padding: .5rem;
    border: 1px solid #6a0016;
    background: #FFF;
}
@media screen and (max-width: 480px) {
   .flex  {
       margin-block:0;
    }
    .flex li {
        margin: 1rem auto;
        font-size:15px;
    }
    .res-glass-name-sub-wrap {
        font-size:15px;
    }
    .ume {
        padding:0;
        font-size: 130%;
        margin:0 auto;
    }
    .cen.go {
        margin: 0 auto 1rem;
    } 
    .res-link-url {
        width: 90%;
    }

}