@charset "UTF-8";

/* --------------------------------------------------
 Box
-------------------------------------------------- */
/* 一般ボックス --------------- */
.blcComm{ /* ふち有り・グリッド有り */
margin:5%;
padding:5%;
background:url(../img/common/frm.png), url(../img/common/frm.png), url(../img/common/frm_bg.png);
background-repeat:no-repeat, no-repeat, repeat-y;
background-position:top left, bottom left, top left;
background-size:100%, 100%, 100%;
border-radius:3px;
box-shadow:rgba(0, 0, 0, 0.2) 0 0 5px 0, rgba(0, 0, 0, 0.3) 0 8px 8px -6px;
}

.blcComm2{ /* ふち有り・グリッド無し */
margin:5%;
padding:5%;
background:url(../img/common/frm.png), url(../img/common/frm.png), url(../img/common/frm2_bg.png);
background-repeat:no-repeat, no-repeat, repeat-y;
background-position:top left, bottom left, top left;
background-size:100%, 100%, 100%;
border-radius:3px;
box-shadow:rgba(0, 0, 0, 0.2) 0 0 5px 0, rgba(0, 0, 0, 0.3) 0 8px 8px -6px;
}

.blcComm3{ /* ふち無し・グリッド無し */
margin:5%;
padding:5%;
background:#fff;
border-radius:3px;
box-shadow:rgba(0, 0, 0, 0.2) 0 0 5px 0, rgba(0, 0, 0, 0.3) 0 8px 8px -6px;
}

.blcComm4{ /* ふち無し・グリッド無し・余白なし */
margin:5%;
background:#fff;
border-radius:3px;
box-shadow:rgba(0, 0, 0, 0.2) 0 0 5px 0, rgba(0, 0, 0, 0.3) 0 8px 8px -6px;
}

/* 一般インナー --------------- */
.innerComm{
margin:3%;
}

/* --------------------------------------------------
 Title
-------------------------------------------------- */
/* ページタイトル --------------- */
#pageTitle{
margin-bottom:5%;
box-shadow:rgba(0, 0, 0, 0.4) 0 0 5px 0;
}

/* 一般タイトル --------------- */
.ttlComm{
margin-bottom:5%;
padding:0 0 3% 5%;
box-shadow:0 2px 2px #dedede;
font-size:115%;
}

.ttlComm:before{
content:"";
margin-right:3%;
border-left:#43890b solid 5px;
}

.ttlComm span{
padding-left:3%;
font-size:70%;
}


/* --------------------------------------------------
 Table
-------------------------------------------------- */
/* 一般テーブル --------------- */
.tblComm th{
width:30%;
padding:3%;
background:#f7f7f7;
border-right:#d5d5d5 solid 1px;
border-bottom:#d5d5d5 solid 1px;
}

.tblComm td{
padding:3%;
border-bottom:#d5d5d5 solid 1px;
}

.tblComm tr:last-child th,
.tblComm tr:last-child td{
border-bottom:none;
}

.tblComm2 tr{
border-bottom:#fff solid 15px;
}

.tblComm2 tr:last-child{
border-bottom:none;
}

.tblComm2 th{
width:20%;
padding:4% 4% 4% 0;
border-right:#ccc solid 1px;
}

.tblComm2 td{
padding:4% 0 4% 4%;
}


/*
 |?**********************************************?*
 | max-width:480px
 |?**********************************************?*
*/

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

.tblComm2 th{
display:block;
width:100%;
padding:0 0 4% 0;
border:none;
border-bottom:#d5d5d5 solid 1px;
}

.tblComm2 th:before{
content:"";
margin-right:3%;
border-left:#43890b solid 4px;
}

.tblComm2 td{
display:block;
width:100%;
padding:4% 0;
}

}

.tblComm input,
.tblComm textarea,
.tblComm select,
.tblComm2 input,
.tblComm2 textarea,
.tblComm2 select{
vertical-align:middle;
}

/* --------------------------------------------------
 Text
-------------------------------------------------- */
.txtLine{
margin:0 0 1em;
}

.txtBig{
font-size:115%;
}

.txtSmall{
font-size:85%;
}

.txtRed{
color:#d30;
}

.txtNavy{
color:#039;
}

/* --------------------------------------------------
 Other Classes
-------------------------------------------------- */
/* クリアーフィックス --------------- */
.clearFix:after{
content: "";
clear: both;
display: block;
}

/* クリアー --------------- */
.clear{
clear:both;
}

/* 非表示 --------------- */
.hidden{
position:absolute;
text-indent:-9999px;
overflow:hidden;
}

/* 画像装飾 --------------- */
.imgDeco{
border:#fff solid 5px;
box-shadow:rgba(0, 0, 0, 0.2) 2px 2px 4px 0;
}

/* 下ボーダー --------------- */
.lineUnder{
border-bottom:#999 dotted 1px;
margin:0px 0px 10px;
padding:0px 0px 10px;
}