@charset "UTF-8";

/* 全体的なレイアウトはこちらに設定
このcssを変更するとマルチサイト全体に影響します。
*/


/*--------------------------------
ヘッダー
--------------------------------*/


header{
    margin-bottom:20px;
    position:relative;
}

.headbar{
    background:#e8e8e8;
}

@media(max-width:768px){
    .headbar{
        margin-top:40px;
    }
}


@media(min-width: 769px){

    .headbar-in{
        max-width:990px;
        margin:0 auto;
        display: flex;
        justify-content: space-between;
        line-height:1;
    }

}

.h1-common{
    max-width:200px;
    //padding:20px;
}



.h-nav{
    display: flex;
    justify-content:flex-end;
    align-items: center;
}


.h-nav a{
    border-left:1px solid #999;
    text-align: center;
    padding: 0 10px;
}

.h-nav li:last-child a{
    border-right:1px solid #999;
}


.h1-head{
    max-width:220px;
    margin:0 auto;
    padding:10px 0;
}

@media(min-width:769px){

    .head-kougaku{
        max-width:990px;
        margin: 0 auto;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    
    .h1-head{
        max-width:280px;
    }
}



/* 検索フォーム */


@media(min-width:769px){
    .h-form{
        display:flex;
        justify-content: flex-end;
        align-items: center;
    }
}

@media(max-width:768px){
    .h-form{
        //background: #fff;
        padding:20px 0 0 0;
        //margin-bottom:20px;
    }
}

.gsib_a{
    width:260px !important;　
}

/* 文字の大きさ変更 */

@media(min-width:769px){
    .h-button{
        display: flex;
        justify-content: flex-end;
        align-items: center;
    }
}
    

.h-sns > div{
    width:26px;
    float:left;
    margin-right:10px;
}

@media(max-width:768px){
    .h-button{
        position: relative;
    }
    .h-sns{
        position: absolute;
       	bottom:-10px;
        right:10px;
    }
}

.h-font{
    display: flex;
    align-items: center;
}

.h-font > div{
    margin-right:4px;
}

.h-font li{
    background:#999;
    color:#fff;
    float: left;
    margin-left:10px;
    padding:0 10px;
    text-align: center;
    font-size:1.2rem;
    cursor: pointer;
}

.h-font li:first-child{
    margin-left:0;
}

.h-font .current{
    background:#3d85c6;
    color:#fff;
}

/*======================================================
ナビ設定
======================================================*/

/*------------------------------
スマホの場合のグローバルナビ（開閉）
------------------------------*/

/* PC時は、pointer-eventsをnoneにする */
.menu-trigger{
    pointer-events: none;    
}


@media(max-width:768px){
    
    .s-headbar{
        background: #094;
        height:40px;
        width:100%;
        position: relative;
        z-index: 10;
    }
    
    /* PC時は、pointer-eventsをallにする */
    .menu-trigger{
        pointer-events: all;    
    }

    .menu-trigger,
    .menu-trigger span{
        transition: all .4s;
        box-sizing: border-box;
        cursor :pointer;
    }

    .menu-trigger span{
        position: absolute;
        color: #fff;
        right: 30px;
        top: 10px;
        z-index:20px;
    }
    
    .nav-close{
        display: none;
    }

    .active .nav-open{
        display:none;
    }
    
    .active .nav-close{
        display:inherit;
    }
    
    .gl{
        display: none;
        position: absolute;
        top: 50;
        background: #e3eeaf;
        width: 100%;
        z-index: 100;
    }
    .gl > ul{
        padding: 20px;
        height:100%;
    }
    .gl > ul > li{
        border-bottom: 1px solid #fff;
    }
    .gl > ul > li a{
        display: block;
        text-align: center;
        text-decoration: none;
        color: #fff;
        padding: 15px 0;
    }

    .g-nav .dr-menu{
        height:inherit;
    }

}

/*------------------------------
グローバルナビ　PCスマホ共通
------------------------------*/

@media(max-width:768px){
    .s-headbar{
        position: fixed !important;
        top:0;
    }
}


/*------------------------------
グローバルナビ　PCスマホ共通
------------------------------*/

.g-nav > ul{
    display: flex;
    justify-content: space-between;
    align-items:center;
    max-width:990px;
    margin:0 auto;
}

.g-nav li:first-child{
    border-left: 1px solid #fff;
}

.g-nav-main li a:link, .g-nav-main li a:visited{
    color:#fff;
}

.g-nav-sub li a:link, .g-nav-sub li a:visited{
    color:#376742;
    font-weight: bold;
}

/*------------------------------
PCの場合のグローバルナビ
------------------------------*/



@media(min-width:769px){

    .g-nav > li:first-child{
        border-left: 1px solid #fff;
    }

    .g-nav-main li a:link, .g-nav-main li a:visited{
        color:#fff;
        font-weight: bold;
    }

    .g-nav-sub > li a:link, .g-nav-sub > li a:visited{
        color:#376742;
        font-weight: bold;
    }

    .g-nav-main{
        background:#76bb86;
    }

    .g-nav-main ul{
        background:#376742;
    }

    .g-nav-sub{
        background: #e3eeaf;
    }

    .g-nav-sub ul{
        background: #d5e87a;
		z-index: 100;
    }

    .g-nav li{
        border-right:1px solid #fff;
        text-align: center;
    }

    
    .g-nav-main > ul li{
        width: calc( 100% / 5 );
        line-height: 18px;
    }
	
	.g-nav-main > ul li a{
		padding: 12px 0;
		width:100%;
		display: block;
	}
    
    .g-nav-sub > ul > li{
        width: calc( 100% / 6 );
    }
    
    .g-nav-child > ul > li{
        width: calc( 100% / 5 );
    }
}

/*------------------------------
スマホの場合のグローバルナビ体裁
------------------------------*/

@media(max-width:768px){
    
    .s-head-box{
        padding:0 10px 20px;
    }
    
    .g-nav ul{
        flex-wrap: wrap;
    }
    
    .g-nav-main li{
        width:50%;
        border:2px solid #fff;
        padding:4px;
        background:#376742;
        
    }
    
    .g-nav-sub > li{
        width:50%;
        border:2px solid #fff;
        padding:4px;
        background:#d5e87a;
    }
    .sub-menu{
        display: none;
    }   
 
    .g-nav .dr-menu{
        padding:20px 0 0 0;
    }
    
    .g-nav > ul{
        flex-wrap: wrap;
    }

    .g-nav-main > ul > li{
        width:50%;
        border:2px solid #fff;
        padding:6px;
        background:#376742;
        font-weight: normal;
        display: block;
    }
    
    .g-nav-main > ul > li a{
        display: block;
        padding:6px;
    }

    .g-nav-sub > ul > li{
        width:50%;
        border:2px solid #fff;
        padding:6px;
        background:#d5e87a;
        font-weight: normal;
        display: block;

    }
    .g-nav-sub > ul > li a{
        padding:6px;
        display: block;
    }
   
    .g-nav-other > ul li{
        background: #4e9f54;
        border:2px solid #fff;
        padding: 6px;
        display: block;
    }
    
    .g-nav-other > ul li a{
        padding:6px;
        display: block;
    }
    
    .g-nav-other > ul li a:link,.g-nav-other > ul li a:visited{
        color:#fff;
        font-weight: bold;
        font-weight: normal;
    }
    
    .g-nav .dr-01 .sub-menu {
        position: absolute;
        top: 40px;
        width: 100%;
        background: #d5e87a;
    }
}



/* グローバルナビ　ドロップダウン設置　*/

@media(min-width:769px){
    .dr-menu {
        position: relative;
        width: 100%;
        height: 40px;
        max-width: 1024px;
        margin: 0 auto;
        display: flex;
        justify-content: space-between;
    }

    .dr-menu > li {
        height: 40px;
        //line-height: 20px;
        display: block;
        width: calc (100% / 6);
        color:#376742;
        position: relative;
    }

    .dr-menu > li a {
        display: block;
        color:#376742;
        padding: 8px 0;
        font-weight: bold;
    }

    .g-nav .dr-menu > .dr-01 {
        position: relative;
    }

    .g-nav .dr-01 .sub-menu {
        position: absolute;
        top: 40px;
        width: 100%;
        background: #d5e87a;
        -webkit-transition: all .2s ease;
        transition: all .2s ease;
    }

    .g-nav .dr-01:hover .sub-menu {
        visibility: visible;
        opacity: 1;
    }
}


/*　子テーマのグローバルナビの高さを40pxに */

.dr-menu .g-nav-child > li a{
	height:40px;
}


.sub-menu {
    visibility: hidden;
    opacity: 0;
    z-index: 1;
    width:100%;
}

.sub-menu li:hover {
    background: #e3eeaf;
    color:#fff;
    -webkit-transition: all .5s;
    transition: all .5s;
}


.sub-menu li {
    border-top: 1px solid #fff;
	text-align: left;
}

.sub-menu li a{
	padding-left:10px;
}

.sub-menu li a:hover {
    background: #e3eeaf;
    text-decoration: none;
}

.dr-menu > li.dr-single {
    position: relative;
}

.sub-menu {
    //position: absolute;
    top: 40px;
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
}

.sub-menu li:hover .sub-menu {
    top: 40px;
    visibility: visible;
    opacity: 1;
}

/* ターゲットナビ、グローバルナビ　カレントの時の色設定　*/

.g-nav.g-nav-main .current{
    background:#36813d;
}
.g-nav .current{
    background: #e3eeaf;
}


/*--------------------------------
フッター
--------------------------------*/


.f-menu{
    background: url(../img/footer/bg-footer.jpg) no-repeat center bottom #ccf99a;
    padding:20px 0;
    background-size:cover;
}

.f-nav{
    max-width:990px;
    margin:10px auto;
    display: flex;
    justify-content: space-between;
}

.f-nav li a:link, .f-nav li a:visited{
    color:#1b5e20;
    font-weight: bold;
}

.f-nav li::before{
    font-family: "Font Awesome 5 Free";
    content: "\f07b";
    color:#1b5e20;
    margin-right:6px;
    font-weight: bold;
    font-weight: 900;
}

/* ブルーのナビエリア　*/

.f-link{
    background: #e3efef;
}

.f-link-nav{
    padding:4px 0;
}

@media(min-width:769px){
    .f-link-nav ul{
        display: flex;
        justify-content: center;
    }

    .f-link-nav li{
        padding: 0 1em;
        border-left:1px solid #999;
        text-align: center;
    }

    .f-link-nav li:last-child{
        border-right:1px solid #999;
    }
}

@media(max-width:768px){
    .f-link nav li{
        text-align: center;
        border-bottom:1px solid #999;
        padding:4px 0;
    }
}


/* footer　学内リンク　*/

@media(min-width:769px){

    .f-campus{
        display: flex;
        justify-content: center;
        align-items:center;
    }
}

.f-logo{
    max-width:200px;
}

.f-campus > dl{
    margin: 20px 10px;
    font-weight: bold;
    font-size:1.2rem;
}

.f-sns > div{
    display: inline-block;
}

.f-fb{
    background: #4267b2;
    border-radius: 50%;
    width:30px;
    height:30px;
    color:#fff;
    text-align: center;
    line-height: 30px;
}

.f-tw{
    background: #000000;
    border-radius: 50%;
    width:30px;
    height:30px;
    color:#fff;
    text-align: center;
    line-height: 30px;
}

.f-mail{
    background: #ea6946;
    border-radius: 50%;
    width:30px;
    height:30px;
    color:#fff;
    text-align: center;
    line-height: 30px;
}

.f-fb a:link,.f-fb a:visited,.f-fb a:hover,
.f-tw a:link,.f-tw a:visited,.f-tw a:hover,
.f-mail a:link,.f-mail a:visited,.f-mail a:hover{
    color:#fff;
}

.f-copy{
    background: #0d5140;
    padding:10px 0;
}

.f-copy p{
    color:#fff;
    text-align: center;
    font-size:1.2rem;
}

@media(max-width:768px){
    .f-logo{
        margin:10px auto;
    }
    
    .f-campus{
        text-align: center;
        padding: 10px 0;
    }
    
    .s-nav ul{
        margin-bottom:20px;
    }
    
    .s-nav ul li{
            padding:6px 4px;
            color:#094;
        }

    .s-nav ul li a:link,.s-nav ul li a:visited,.s-nav ul li a:hover{
        color:#fff;
    }
    
    .f-link{
        background: #4b9e36;
        color:#fff;
    }
    
    .f-link nav li{
        border-bottom:1px solid #fff;
        padding:6px;
    }
    
    .f-link nav li a:link,.f-link nav li a:visited,.f-link nav li a:hover{
        color:#fff;
    }

    
}

/* フッターサイトマップ */



footer .wsp-pages-title{
    display: none;
}

footer .wsp-pages-list {
    display: flex;
    justify-content: flex-start;
}

footer .wsp-pages-list > li{
    font-size:1.4rem;
}

footer .wsp-pages-list > li::before{
    font-family: "Font Awesome 5 Free";
    content: "\f07b";
    font-weight: bold;
    font-weight: 900;
    margin-right:4px;
}

footer .wsp-pages-list li{
    font-size:1.4rem;
    border-bottom:none;
}

footer .wsp-pages-list li a:link, footer .wsp-pages-list li a:visited,footer .wsp-pages-list li a:hover{
    color:#333;
}

footer .wsp-pages-list .children li{
    list-style: none;
}


footer .wsp-pages-list .children > li:first-child{
    display: none;
}


/*  ページトップへ戻る  */

#pageTop {
  position: fixed;
  bottom: 20px;
  right: 20px;
 font-size:3.0rem;
    background:rgba(122, 110, 99, 0.6);
    width:60px;
}

#pageTop i {
  padding-top: 6px
}

#pageTop a {
  display: block;
  z-index: 999;
    color:#fff;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
}

#pageTop a:hover {
  text-decoration: none;
  opacity: 0.7;
}


/*--------------------------------
サイドバー
--------------------------------*/


/* サイドバーコンテンツ　*/

.sidebar article{
    margin-bottom:20px;
}

/* パンくずリスト　*/

.breadcrumbs{
    color:#094;
}

.breadcrumbs a:link, .breadcrumbs a:visited{
    color:#76bb86;
}

/* 　サイドメニュー　*/

.s-menu{
	//margin-bottom:20px;
	}

.s-menu-h1{
    background: #009944;
    color:#fff;
    text-align: center;
    font-size:1.6rem;
    padding: 4px 0;
}

.s-menu-list{
    border:1px solid #aacd06;
    margin-bottom:20px;
}

.s-menu-list li{
    border-bottom:1px solid #aacd06;
    display: block;
    //height:50px;
    font-weight: bold;
}

.s-menu-list li:last-child{
    border-bottom:none;
}

.s-menu-list li a{
    display: block;
    padding:10px;
}

.s-menu-list li a:hover{
    background: #f3f7e1;
    text-decoration: none;
}

.s-menu-list > li:last-child{
    border-bottom: none;
}

.s-nav{
    margin-bottom:20px;
}

@media(max-width:768px){
    .s-nav ul{
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }

    .s-nav ul li{
        width:50%;
        background: #666;
        border:1px solid #fff;
        display: block;
        text-align: center;
    }
    
    .s-nav ul li a{
        display: block;
    }
    
}
/* PCのときだけH29年以前のリンクバナーの下にマージンをつける  */
@media(min-width:769px){
    .side-h29link{
        margin-bottom:20px;
    }
}

/* サイドメニューのアコーディオン設定。工学部のみで使用。*/

.toggle_bt {
    position: relative;
    cursor: pointer;
    //padding: 10px;
}

.toggle_bt::after {
    content: "";
    display: inline-block;
    width: 18px;
    background-size: contain;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 20px;
    transition: transform .2s;
}

.toggle_bt.open::after {
    transform: rotateZ(180deg);
    top: 46%;
}

.s-menu-list .sub-menu {
    display: none;
}

.s-menu-list .sub-menu li{
    text-indent: 1em;
    display: block;
    font-size:1.4rem;
}

.s-menu-list .sub-menu li a{
    display: block;
    padding:10px;
    cursor:pointer;
    background: #e3eeaf;
}

.s-menu-list .sub-menu li a:hover{
    border-bottom:1px solid #fff;
}

.s-menu-list .sub-menu{
    opacity: 1;
    visibility: inherit;
}




/*--------------------------------
タブの切り替え 
--------------------------------*/

.Ktab{
    display: flex;
    justify-content: space-between;
}

.Ktab li{
    margin-right: 1px;
    //border: 1px solid #ccc;
    border-radius: 0px 20px 0px 0px;
    width: calc( 100% / 6 );
    text-align: center;
    padding:5px;
    background:#f2f6ef;
    color:#999;
}

.Ktab li.Kactive{
    border-bottom: none;
}

.Ktab li:last-child{
    margin-right:0;
}

.Ktab li.Kactive {
    color: #333;
    background: #fff;
    cursor: auto;
}

.Karea > div {
    display: none;
    border-left:1px solid #ccc;
    border-right:1px solid #ccc;
    border-bottom:1px solid #ccc;
    padding:20px;
}
.Karea > div.Kshow {
    display: block;
    background: #f2f2f2;
}

.Ktab li:hover{
    cursor: pointer;
}

@media(max-width:768px){

    .Ktab{
        display: flex;
        flex-wrap:wrap;
    }

    .Ktab > li{
        width:49%;
        border:1px solid #999;
        border-radius: 0px;
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        margin-bottom:10px;
    }

    .Ktab > li:nth-child(2n){
        margin-right:0;
    }

    .Ktab li.Kactive{
        border-bottom: 1px solid #999;

    }
}

/*--------------------------------
検索ページ　全サイト共通レイアウト
--------------------------------*/

.search-dl{
    margin-bottom:10px;
}

.search-dl dt::before{
    font-family: "Font Awesome 5 Free";
    content: "\f101";
    font-weight: bold;
    font-weight: 700;
    color:#094;
}

.search-dl dd a:link,.search-dl dd a:visited,.search-dl dd a:hover{
    color:#999;
}

/*--------------------------------
検索ボタン　全サイト共通レイアウト
--------------------------------*/

.bt-search{
    margin-bottom:10px;
}

.search-text{
    padding:4px;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    width:260px;
}

@media(max-width:768px){
    .search-text{
        width:80%;
        padding:8px;
    }
}

.search-button{
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    padding:4px;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
}

/*--------------------------------
サイトマップ　全サイト共通レイアウト
--------------------------------*/

.wsp-pages-list > li{
    font-size:1.8rem;
    border-bottom:1px solid #ccc;
    margin-bottom:1em;
    padding-bottom:1em;
}

.wsp-pages-list > li >a{
    color:#094;
}

.wsp-pages-list .children > li{
    margin-left:1em;
    list-style: circle;
}

.wsp-pages-list .children > li:first-child{
    margin-top:1em;
    list-style: circle;
}

/*--------------------------------
カテゴリー一覧ページ
--------------------------------*/

.page-navi{
    text-align: center;
    margin:30px 0;
}



/*------------------------------
スマホの場合のグローバルナビ体裁
------------------------------*/

.pager p,.pager p a:link,.pager p a:visited,.pager p a:hover{
    color:#777;
}

/*--------------------------------
教員一覧ページ
--------------------------------*/
.t-profile{
    margin-bottom:20px;
}

.t-profile dt{
    font-weight: bold;
    float:left;
    clear:both;
    margin-bottom:1em;
    line-height: 1.5;
    width:15%;
}

.t-profile dd{
    margin-left:15%;   
}

.t-profile dd:after{
    display: block;
    content: "";
    clear: both;
}

@media(max-width:320px){
    dt{
        width:100%;
        float:none;
    }
    
    dd{
        margin-left:auto;
    }
}