﻿@charset "utf-8";


/*--------------------------------------------------*
 * Sunco Recruit 各ページ共通 CSS
 *--------------------------------------------------*/

.jumbotron-extend {
    /* タイトル部分 */
    /*background: url('../Content/Images/Welcome Scan.jpg') center center no-repeat;*/
    background: url('../Content/Images/top_spmain.png') center center no-repeat;
    background-size: cover;
    font-family: 'Playfair Display', serif;
    letter-spacing: .1em;
    text-align: justify;
    max-height: 80px;
    padding-top: 20px;
}
.jumbotron_title1 {
    /*font-family: 'Times New Roman', Times, serif;*/
    font-family: '游ゴシック', 'メイリオ', 'MS Pゴシック', sans-serif;
    font-size: larger;
    font-weight: 600;
}
.jumbotron_title2 {
    /*font-family: 'Times New Roman', Times, serif;*/
    font-family: '游ゴシック', 'メイリオ', 'MS Pゴシック',sans-serif;
    font-size: large;
    font-weight: 600;
}
/* ナビゲーションバー部分 */
.navbar {
    margin-top: 0;
    margin-bottom: 0;
}
.navbar-brand {
    color: orange !important;
    font-size: small !important;
    text-align: right;
}
    .navbar-brand>img {
        max-height:26px !important;
    }

/* ドロップダウンメニューに追加してスクロール可能にする */
.scrollable_menu {
    height:auto;
    max-height: 500px;
    overflow-x: hidden;
}

/* 余白、非表示、文字サイズ、枠幅、項目幅、背景色、文字色 */
.yohaku_bottom { margin-bottom:20em !important; }
.no_display{ display: none; }
.font_xxlarge{font-size:xx-large !important}
.font_xlarge{ font-size:x-large !important}
.font_large{ font-size: large !important; }
.font_medium{ font-size: medium !important; }
.font_small{ font-size: small !important; }
.font_smaller{ font-size: smaller !important; }
.font_xsmall{ font-size: x-small !important; }
.font_xxsmall{ font-size: xx-small !important; }
.border_thick{ border-width:thick !important; }
.width_min_2chara { min-width: 72px !important; }
.width_min_4chara { min-width: 86px !important; }
.width_min_6chara { min-width: 100px !important; }
.width_min_7chara { min-width: 140px !important; }
.width_max_2chara { min-width: 72px !important; }
.width_max_4chara { max-width: 86px !important; }
.width_max_6chara { max-width: 100px !important; }
.width_max_7chara { max-width: 140px !important; }
.width_180px { max-width:180px !important; min-width: 180px !important; }
.width_200px { max-width:200px !important; min-width: 200px !important; }
.height_100px { max-height: 100px !important; min-height: 100px !important; }
.height_200px { max-height: 200px !important; min-height: 200px !important; }
.height_250px { max-height: 250px !important; min-height: 250px !important; }
.height_300px { max-height: 300px !important; min-height: 300px !important; }
.bg_color_darkgray { background-color: #a9a9a9 !important; }
.bg_color_silver{ background-color: #c0c0c0 !important; }
.bg_color_yellow {background-color: yellow !important; }
.bg_color_lightyellow { background-color: lightyellow !important; }
.bg_color_pink {background-color: pink !important; }
.bg_color_lightblue { background-color: lightblue !important; }
.bg_color_lightgreen { background-color: lightgreen !important; }
.bg_color_lightgray{ background-color: lightgray !important; }
.bg_color_silverwhite{ background-color: #efefef !important; }
.bg_color_frostygray{ background-color: #e8ece9 !important; }
.bg_color_whitesmoke{ background-color: whitesmoke !important; }
.color_red { color: red !important }
.text_bold6 { font-weight:600 !important }
.text_bold7{ font-weight:700 !important }
.text_bold8{ font-weight:800 !important }
.text_bold9{ font-weight:900 !important }

.form-control {
    min-width: 100%;
}

textarea {
    font-size: smaller;
    height: 10em !important;
    border: solid 1px lightgray;
}

/* 画像の選択禁止、iPhone、Androidの長押し画像保存を禁止、ファイル操作禁止 */
img {
    pointer-events: none !important;
    -moz-user-select: none;         /* Firefox */
    -webkit-user-select: none;      /* Konqueror */
    -ms-user-select: none;          /* Internet Explorer/Edge */
    -webkit-touch-callout: none;    /* iOS Safari*/
    user-select: none;              /* Non-prefixed version, currently supported by any browser but < IE9 */
}

/* 動画の選択禁止、iPhone、Androidの長押し画像保存を禁止、ファイル操作禁止 */
video {
    pointer-events: none !important;
    -moz-user-select: none; /* Firefox */
    -webkit-user-select: none; /* Konqueror */
    -ms-user-select: none; /* Internet Explorer/Edge */
    -webkit-touch-callout: none; /* iOS Safari*/
    user-select: none !important;
}


/* PageTopへボタン */
#page-top {
    position: fixed;
    bottom: 35px;
    right: 20px;
    font-size: medium;
}
    #page-top a {
        opacity: 0.6;
        background: #fa4ed2; /*#222222;*/
        text-decoration: none;
        color: white;
        width: 10em;
        padding: 10px 0;
        text-align: center;
        /*vertical-align: middle;*/
        display: block;
        border-radius: 5px;
    }
        #page-top a:hover {
            text-decoration: none;
            opacity: 0.8;
        }

/*--------------------------------------------------*
 * レスポンシブ対応
 * 左のMENUとNAVバーのメニューを切り替える
 *--------------------------------------------------*/
/* [デフォルト：スマホ用] */
#menu_btns {
    display: none;
}
.footer_area{
    font-size: xx-small !important;
}
.btn_left_menu_area {
    display: none;
}
.large_menu {
    display: none;
}
.small_menu {
    display: block;
}
.small_menu_item {
    display: block;
}
.dropdown-menu{
    min-height: 200px;
    max-height: 480px;
    overflow-y: auto;
}
/* default (color:primary, hover時background:info) */
.dropdown-menu > a{
    color: #007bff !important;
}
.dropdown-menu > a:hover {
    background-color: #17a2b8 !important;
    color: #fff !important;
}
/* primary=#007bff */
.dropdown-menu > a.menu_item_primary{
    color: #007bff !important;
}
.dropdown-menu > a.menu_item_primary:hover {
    background-color: #007bff !important;
    color: #fff !important;
}
/* success=#28a745*/
.dropdown-menu > a.menu_item_success{
    color: #28a745 !important;
}
.dropdown-menu > a.menu_item_success:hover {
    background-color: #28a745 !important;
    color: #fff !important;
}
/* info=#17a2b8 */
.dropdown-menu > a.menu_item_info{
    color: #17a2b8 !important;
}
.dropdown-menu > a.menu_item_info:hover {
    background-color: #17a2b8 !important;
    color: #fff !important;
}
/* danger=#ff4500 */
.dropdown-menu > a.menu_item_danger{
    color: #ff4500 !important;
}
.dropdown-menu > a.menu_item_danger:hover {
    background-color: #ff4500 !important;
    color: #fff !important;
}
/* dark=#6c757d */
.dropdown-menu > a.menu_item_dark{
    color: #000 !important;
}
.dropdown-menu > a.menu_item_dark:hover {
    background-color: #343a40 !important;
    color: #fff !important;
}
/* orange=#ffc107 */
.dropdown-menu > a.menu_item_orange:hover {
    background-color: #ffc107 !important;
    color: #343a40 !important;
}

/* メモ
    Bootstrap 4 
    xs : Extra Small。小型スマートフォンなど。575px以下。 
    sm : Small。通常スマートフォンなど。576～767px。 
    md : Medium。タブレット。768～991px。 
    lg : Large。中型ディスプレイ。992～1199px。 
    xl : Extra Large。大型ディスプレイ。1200px以上。 
*/

/* [タブレット用] 481px(bootstrap4のmdに合わせて768pxに変更)以上に適用 */
@media screen and (min-width:768px) {
    .jumbotron-extend{
        max-height: 120px;
        padding-top: 28px;
    }
    .jumbotron_title1 {
        font-size: x-large;
        font-weight: 600;
    }
    .jumbotron_title2 {
        font-size: larger;
        font-weight: 600;
    }
}

/* [PC用] 960px(bootstrap4のlgに合わせて992pxに変更)以上に適用 */
@media screen and (min-width:992px) {
    .jumbotron-extend{
        max-height: 160px;  
        padding-top: 40px;      
    }
    .jumbotron_title1 {
        font-size: xx-large;
        font-weight: 600;
    }
    .jumbotron_title2 {
        font-size: x-large;
        font-weight: 600;
    }
    #menu_btns {
        display: block;
    }
    /* default (info=#17a2b8) を 70% 透過 */
    #menu_btns a:hover {
        background-color: rgba(23,162,184,0.7) !important;
        color: #fff !important;
    }
    /* primary=#007bff を 70% 透過 */
    #menu_btns a.menu_item_primary:hover {
        background-color: rgba(0,123,255,0.7) !important;
        color: #fff !important;
    }
    /* success=#28a745 を 70% 透過 */
    #menu_btns a.menu_item_success:hover {
        background-color: rgba(40,167,69,0.7) !important;
        color: #fff !important;
    }
    /* info=#17a2b8 を 70% 透過 */
    #menu_btns a.menu_item_info:hover {
        background-color: rgba(23,162,184,0.7) !important;
        color: #fff !important;
    }
    /* danger=#dc3545 を 70% 透過 */
    #menu_btns a.menu_item_danger:hover {
        background-color: rgba(220,53,69,0.7) !important;
        color: #fff !important;
    }
    /* dark=#343a40  を 50% 透過 */
    #menu_btns a.menu_item_dark:hover {
        background-color: rgba(52,58,64,0.5) !important;
        color: #343a40 !important;
    }
    .dropdown-menu {
        min-height: 200px;
        max-height: 600px;
        overflow-y: auto;
    }
    .footer_area {
        font-size: x-small !important;
    }
    .btn_left_menu_area {
        display: block;
    }
    .large_menu {
        display: block;
    }
    .small_menu {
        display: none;
    }
    .small_menu_item {
        display: none;
    }
}
/* ---[ メモ：Bootstrap 4 カラーコード ]---
        primary=#007bff  
        secondary=#6c757d  
        success=#28a745  
        danger=#dc3545  
        warning=#ffc107
        info=#17a2b8  
        light=#f8f9fa  
        dark=#343a40  
        muted=#6c757d  
        text-whilte=#fff
*/
/*--------------------------------------------------*/

/*--------------------------------------------------*
    Account Entry
 *--------------------------------------------------*/
/*#tmp_name_sei, #tmp_name_mei,
#tmp_name_sei_kana, #tmp_name_mei_kana,
#tmp_addr1_city, #tmp_addr1_line, #tmp_addr1_bldg,
#tmp_addr2_city, #tmp_addr2_line, #tmp_addr2_bldg,
#tmp_univ_head_kana,
#tmp_another_univ_nm, #tmp_another_univ_fc_nm, #tmp_another_univ_dp_nm,
#tmp_univ_semi_nm, #tmp_univ_club_nm,
#tmp_hs_nm_ichibu, #tmp_another_Hs_Nm {
    ime-mode: active !important;
}
#tmp_name_sei_rome, #tmp_name_mei_rome,
#tmp_addr1_zip, #tmp_addr2_zip,
#tmp_addr1_tel, #tmp_addr1_mtel, #tmp_addr2_tel,
#tmp_pemail, #pemail_2, #tmp_memail, #memail_2 {
    ime-mode: inactive !important;
}*/