@import "/css/v2/common.css";
@import "/css/v2/parts.css";
@import "/common/css/st_module.css";
@import "/common/css/resp_pc.css";
@import "/common/css/font.css";


a:hover img {opacity: 0.8;}

/*common*/

.sp-page {
background-color:#fff;
font-size: 1rem;
line-height: 1.5rem;
margin: 10px 0;
}

.contents{
padding:10px 125px;
}

.contents h3{
font-size: 1rem;
font-weight: bold;
color: #4F1D21;
margin: 0.5em 0 0.8em 0;
padding: 0.8em 0 0.4em 0;
border-top: 2px dotted #E3DEDB;
clear: both;
}

.contents p{
margin-bottom: 1rem;
line-height: 1.5rem
}

.sns {margin-bottom: 1rem;}

.center {
text-align: center !important;
}

.ext-link::before {
display: inline-block;
font: normal normal normal 14px/1 FontAwesome;
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
transform: translate(0, 0);
content: "";
margin-right: 0.2rem;
}

.notice,
p.notes,
ul.notes li{
font-size:0.9rem;
text-indent:-1rem;
padding-left:1rem;
line-height: 1.2rem;
margin-bottom: 0.4rem;
}


.txtRed {color: #f00;}

/* === .zoom === */
.zoom{
display:inline-block;
position:relative;
vertical-align:top;
}
.zoom:after{
content:"";
width:22px;
height:22px;
background:url(img/zoom.png) no-repeat 0 0;
position:absolute; bottom:5px; right:5px;
}
.zoom:hover:after{ background-position:-22px 0; }
span.zoom:after{ display:none; }


/* === .title-area === */

.title-area {
background: #fff;
width: 950px;
height: 230px;
position: relative;
}

.title-area h1 {
position: absolute;
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
top: 45px;
left: 404px;
width: 504px;
height: 105px;
background: url(img/h1.png);
background-repeat: no-repeat;
}

.title-area ul li .ganref,
.title-area ul li .dcw,
.title-area ul li .dcm {
width:172px;
height:37px;
display:block;
position:absolute;
top:165px;
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
}

.title-area ul li .ganref {
left:749px;
background: url(img/ganref.png) no-repeat 0 0;
background-size: 100%;
}
.title-area ul li .dcw {
left:576px;
background: url(img/dcw.png) no-repeat 0 0;
background-size: 100%;

}
.title-area ul li .dcm {
left:404px;
background: url(img/dcm.png) no-repeat 0 0;
background-size: 100%;
}

.title-area>img {
position: absolute;
top: 0;
left: 0;
width: 390px;
height: 230px;
}

.subtitle{
font-weight:bold;
text-align:center;
color:#fff;
padding:10px;
background:#000;
border-top:1px solid #666;
}

.subtitle em {
color: #f00;
font-weight: bold;
display: inline-block;
margin-right: 1rem;
}


/* === #schedule === */

#schedule > dl{
padding: 3px;
background: #F2EDEA;
}
#schedule > dl > dt,
#schedule > dl > dd{
padding:10px;
border:1px solid #fff;
}
#schedule > dl > dt{
font-weight:bold;
text-align:center;
color:#4F1D21;
padding-bottom:0.5em;
border-width:1px 1px 0;
}
#schedule > dl > dd{
padding-top:1em;
}
#schedule table{ width:100%; }
#schedule tr:nth-child(5) th,
#schedule tr:nth-child(5) td{ padding-bottom:1em; }
#schedule th,
#schedule td{
padding:0.3em 0;
}
#schedule th{
width:25%;
text-align:right;
padding-right:1em;
vertical-align:top;
}
#schedule td[colspan="2"]{
padding-top:0.5em;
border-top:1px solid #fff;
}
#schedule td[colspan="2"] dt{ font-weight:bold; }
#schedule td[colspan="2"] dd{ overflow:hidden; }
#schedule td[colspan="2"] b{
/*display:inline-block;*/
font-weight:bold;
margin-bottom:0.3em;
}

.thumbUsr90 {margin-right: 10px;}

#schedule .present {
padding: 1rem;
border: 1px solid #AA393F;
background-color: #fff;
overflow: hidden;
}

#schedule .present p {
margin: 0 !important;
}

#schedule .present p img {
float: right;
margin: 1.5rem 0 10px 10px;
width: 160px;
}


/* === .photos === */
.photos {
border-top: 1px dotted #cabab1;
padding-top: 10px;
text-align: center;
}


.photos ul{
margin: 1rem 0;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
justify-content: space-between;
}

.photos ul li {
flex-basis: 32%;
}

.photos ul li a{
position: relative;
display: block;
border:1px solid #ccc;
width: 100%;
background: #fff;
}

.photos ul li a:hover {
border-color:#03f;
}
.photos ul li a::before{
content:"";
display: block;
padding-top: 100%; /* 高さを幅の100%に固定 */
}

.photos ul li a img {
display: block;
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
max-width: 96%;
max-height: 96%;
box-sizing: border-box;
margin: auto;
}

/* === #detail === */


#detail h3 + ul{ margin-bottom:1rem; }

#detail li{
list-style-type:disc;
line-height:1.4;
margin:0.4em 0 0.4em 1.5em;
}
#detail .notes{
display:inline-block;
margin:0.5em 0 0;
}
#detail li .notes{ margin-top:0; }
#detail .related{
border-top-width:0;
padding-top:0;
}


/* === #apply === */

#apply{
text-align:center;
border-top:4px double #E3DEDB;
padding-top: 1rem;
}

#apply p:first-child{ color:#CB1613; }

.btn-entry a{
display:block;
width: 70%;
margin: 0 auto;
font-size:1.2rem;
font-weight:bold;
text-decoration:none;
color:#fff;
padding:8px;
background:-moz-linear-gradient(top, #cc0000, #8F0000);
background:-webkit-gradient(linear,left bottom,left top,color-stop(0, #8F0000),color-stop(1, #cc0000));
background:linear-gradient(to top, #cc0000, #8F0000);
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#cc0000', endColorstr='#8F0000');
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#cc0000', endColorstr='#8F0000')";
zoom:1;
border:1px solid #8F0000;
border-radius:6px;
box-shadow:1px 1px 3px rgba(0,0,0,.6),
1px 1px 0 rgba(255,255,255,.5) inset,
-1px -1px 0 rgba(255,255,255,.2) inset;
}
.btn-entry a:hover{
color:#ff0;
background:-moz-linear-gradient(top, #b70000, #750000);
background:-webkit-gradient(linear,left bottom,left top,color-stop(0, #750000),color-stop(1, #b70000));
background:linear-gradient(to top, #b70000, #750000);
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#b70000', endColorstr='#750000');
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#b70000', endColorstr='#750000')";
}


/* ---------------------------
Form
---------------------------- */

.formArea{
margin:1em 0;
}

.formArea * {
font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS P Gothic",Osaka,sans-serif;
text-decoration:none;
}

.formArea h2{
text-align:center;
font-weight:bold;
color:#666;
padding:0.5em 0;
margin-top:1em;
border-top:1px dotted #999;
}

.formArea p{
font-size:90%;
color:#fff;
padding:2px 8px;
background-color:#777;
}

.formArea dl {
margin-bottom:1em;
background:#f6f6f6;
padding-top:1em;
}

.formArea dl dt {
border-left: 4px solid #999;
padding: 0 10px;
margin: 0 0 0.5em 1em
}

.formArea dl dt span {
font-size: 0.7rem;
}

.formArea dd {
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
flex-wrap: wrap;
padding: 0 0 1em 1.5em;
border-bottom:1px dotted #ccc;
margin:0 0.5em 1em;
-ms-align-items: center;
align-items: center;

}

.formArea .fd-column {
flex-direction: column;
}

.formArea dd label {
margin:0 0.8rem 4px 0;
padding: 4px;
}

.formArea label:hover {background: #FEFFD2;}


.formArea dd label:first-child{
margin-left:0;
}

.formArea label.nowrap,
.formArea .nowrap label {
width: 100% !important;
margin-left:0;
}

.formArea label input{
margin-right:0.3em;
}

.formArea dl dd textarea {
width:70%;
height:5em;
}

.formArea dl dd input[type="text"] ,
.formArea dl dd textarea {
width: 300px;
border-radius: 3px;
padding:0.3rem;
font-size:1rem;
border: 1px solid #999;
}

.formArea dl dd select {
font-size:1rem;
border: 1px solid #999;
}

.formArea dl dd .p-postal-code,
.formArea dl dd .p-region {
width: 100px !important;
}


.formArea dl dd .ex {
margin-left: 10px;
}

.formArea .necessary{
display:inline;
font-size:85%;
font-weight:bold;
color:#d33;
padding-left:0.2em;
border-left:0;
white-space:nowrap;
}

.formArea table { 
border-collapse: collapse;
border: 1px solid #aaa;
} 

.formArea table th,
.formArea table td { 
border: 1px solid #aaa;
padding:3px 5px;
} 

.formArea table th { 
background:#ddd;
text-align:center;
} 

.formArea table tr:nth-child(even) {
background: #fff;
}

.formArea dt span,
.formArea dd span{
color:#777;
font-size:0.9em;
}

.formArea dl dd .caption {
flex-basis: 100%;
margin-top: 0.8rem;
}

.formArea dl dd textarea {
width:70%;
height:5em;
}

/* ----- btnArea ----- */
.btnArea{
clear:both;
text-align:center;
padding:1em 0;
margin:0;
}

.btnArea input {
padding:5px 10px;
font-size:1rem;
width:7rem;
margin:0 0.5em;
}


/* ----- Thanks ----- */
.thanks{
width:680px;
text-align:center;
padding:1rem 5px;
margin:1em auto 1.5em auto;
border:1px dashed #FFB500;
background:#fffed0;
box-sizing: border-box;
font-size: 0.9rem;
}

.links {
text-align: center;
}

.profile {
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
margin-bottom: 1rem;
max-width: 672px;
}

.profile dt {margin-right: 15px;}.profile dt img {
width: 150px;
}

#intro .link {
border: 2px solid #67a9aa;
border-radius: 6px;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
align-items: center;
text-align: center;
padding: 5px;
margin-bottom: 1rem;
text-decoration: none;
font-size: 0.9rem;
}

#intro .link:hover {
text-decoration: underline;
background: #FFFDEE;
}

#intro .link img {
margin-right: 10px;
width: 250px;
}

#intro .link p {
margin-bottom: 0;
}

#intro .link p b{
font-size: 1.1rem;
}