@charset "utf-8";

*{ box-sizing:border-box; }

button,label{ cursor:pointer; }

img{
    max-width:100%;
    height:auto;
}

/* レスポンシブ
----------------------------------------------------------------------------- */
@media screen and (max-width: 811px) {
    .pc-only{ display: none !important; /* PCのみ表示 */ }
}
@media screen and (min-width: 812px) {
    .sp-only{ display: none !important; /* SPのみ表示 */ }
}

/* 分類：ローディング
----------------------------------------------------------------------------- */
.loading{
    position:fixed;
    width:100%;
    height:100vh;
    z-index:599999999;
    top:0;
    left:0;
    background-color: rgba(255,255,255,0.5);
}
.loading img{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    margin:auto;
}


/* 分類：レイアウト
----------------------------------------------------------------------------- */
/* インナーレイアウト */
.inner{
    width:100%;
    /*max-width:1200px; /* 案件に応じてコンテンツ幅を指定 */
    margin:0 auto;
}
@media screen and (max-width:768px){
    .inner{
        width:100%; /* 案件に応じてコンテンツ幅を指定 */
    }
}

/* カラムレイアウト */
.col{
    width:100%;
    display:table;
}

/* ２カラム */
.col-2{
    display:table-cell;
    vertical-align:top;
    width:50%;
}
/* ３カラム */
.col-3{
    display:table-cell;
    vertical-align:top;
    width:calc(100% / 3);
}
@media screen and (max-width: 811px) {
    .col-2,
    .col-3{
        display:block;
        width:100%;
    }
}


/* 分類：幅調整モジュール
----------------------------------------------------------------------------- */
.w5{ width:5% !important; }
.w10{ width:10% !important; }
.w15{ width:15% !important; }
.w20{ width:20% !important; }
.w25{ width:25% !important; }
.w30{ width:30% !important; }
.w35{ width:35% !important; }
.w40{ width:40% !important; }
.w45{ width:45% !important; }
.w50{ width:50% !important; }
.w55{ width:55% !important; }
.w60{ width:60% !important; }
.w65{ width:65% !important; }
.w70{ width:70% !important; }
.w75{ width:75% !important; }
.w80{ width:80% !important; }
.w85{ width:85% !important; }
.w90{ width:90% !important; }
.w95{ width:95% !important; }
.w100{ width:100% !important; }

/* 分類：文字・背景
----------------------------------------------------------------------------- */
/* 文字色 */
.fc-black { color:#333333 !important; }
.fc-red   { color:#ed2e64 !important; }
.fc-green { color:#b3d465 !important; }
.fc-blue  { color:#cce7ff !important; }
.fc-blue2 { color:#000080 !important; }
.fc-orange{ color:#facd46 !important; }
.fc-pink  { color:#f29c9f !important; }
.fc-pink2 { color:#ffc0cb !important; }
.fc-gray  { color:#808080 !important; }
.fc-white { color:#ffffff !important; }

/* 背景色 */
.bg-red    { background:#edbecb !important; }
.bg-green  { background:#e0ff99 !important; }
.bg-green2 { background:#66cdaa !important; }
.bg-green3 { background:#98fb98 !important; }
.bg-blue   { background:#cce7ff !important; }
.bg-blue2  { background:#000080 !important; }
.bg-blue3  { background:#1e90ff !important; }
.bg-gray   { background:#f2f2f4 !important; }
.bg-gray2  { background:#808080 !important; }
.bg-orange { background:#facd46 !important; }
.bg-orange2{ background:#ff8c00 !important; }
.bg-pink2  { background:#ffc0cb !important; }
.bg-black  { background:#333333 !important; }

/* 文字サイズ */
.fc-size125   { font-size: 125% !important; }
.fc-size150   { font-size: 150% !important; }
.fc-size200   { font-size: 200% !important; }
.fc-size300   { font-size: 300% !important; }
.fc-size500   { font-size: 500% !important; }

/* フォント */
.ff-min{
    font-family:"游明朝体", "Yu Mincho", YuMincho, "Sawarabi Mincho","Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif !important;
    font-weight:500 !important;
}

/* 強調テキスト */
.fc-strong{
    font-weight:bold;
    background: linear-gradient(transparent 30%, #fef6b2 30%);
    padding:0 5px;
}

/* 分類：インプット系
----------------------------------------------------------------------------- */
input[type="text"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="tel"],
input[type="password"],
input[type="number"],
select,
textarea{
    font-family:inherit;
    border:1px solid #ccc;
    border-radius:3px;
    padding:5px 10px;
    -webkit-appearance: none;
}

select{
    cursor:pointer;
    padding-right:30px !important;
    background-image:url("/common/images/icn_select.png");
    background-repeat:no-repeat;
    background-size:10px 5px;
    background-position:right 10px center;
}
input[type="text"]{
    width:100%;
}
textarea{
    width:100%;
    min-height:100px;
    resize:vertical;
}
@media screen and (max-width: 1100px) {
    input[type="text"],
    input[type="date"],
    input[type="time"],
    input[type="password"],
    input[type="number"],
    select,
    textarea{
        padding:5px;
    }
}

/* ページャー */
.pager{
    text-align:center;
    margin:0 auto 30px;
    padding-top:30px;
}

.pager li{
    display:inline-block;
    margin:0 2.5px;
}
.pager li a{
    display:block;
    width:40px;
    height:40px;
    line-height:40px;
    text-decoration:none;
    background-color:#fff;
    vertical-align:middle;
    text-align:center;
    /*border:1px solid #ddd;*/
    border-radius: 50%;
}
.pager li.first a,
.pager li.prev a,
.pager li.next a,
.pager li.last a{
    border-color: #fff;
}
.pager li a:hover,
.pager li.is-current a{
    background-color:#ed2e64;
    border-color:#111;
    color:#fff;
}

/* 分類：ソート可能テーブル
----------------------------------------------------------------------------- */
.f-sort thead th{
    cursor:pointer;
}
