@charset "utf-8";
/*----------------------*/
/*1.共通
/*----------------------*/

     /*ボックスサイズの計算方法を指定*/
     * {
        box-sizing: border-box;
     }

     /*ページ全体の基本スタイル*/
      body {
        color: black;
        font-size: 14px;
        font-family: メイリオ,Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","MS Pゴシック",sans-serif;
        line-height: 1.6;
    }

     /*リンクの基本スタイル*/
     a {
        color: black;
        transition: 0.5s;
    }

    /*リンクがマウスに乗った時のスタイル*/
    a:hover {
        opacity: 0.7;
    }

     /*画像の基本スタイル*/
     img {
        vertical-align: bottom;
    }

/*----------------------*/
/*2.レイアウト
/*----------------------*/

      /*ページ全体を囲む枠*/
      #wrapper {
        margin: 0 auto;
        width: 960px;
    }

/*----------------------*/
/*3．ヘッダー
/*----------------------*/

     /*エリア外枠スタイル*/
     header {
        padding-top: 15px;
        padding-bottom: 0px;
    }

     /*見出しのスタイル*/
     h1 {
        display: block;
        background-color: black;
        color: burlywood;
        font-size: 50px;
        font-weight: bolder;
        margin-bottom: 0px;
        padding-left: 10px;
    }

    /*見出しのサブタイトル*/
    h1 span {
        font-size: 30px;
        font-weight: lighter;
    }


/*----------------------*/
/*4．グローバルナヴィゲーション
/*----------------------*/

    /*エリア外枠のスタイル*/
    #gNav {
        background: burlywood;
        color: black;
        padding:  5px 15px;
        
        display: -webkit-flex;        /*safari用*/
        display: flex;

    }

    /*エリア左側のスタイル*/
    #gNav-left {
        width: 300px;

    }

    /*左側ロゴ*/
   

    /*エリア右側のスタイル*/
    #gNav-right {
        width: 610px;
        display: block;
        
        

    }

    /*メニューリストを囲む枠*/
    #gNav ul {
        display: -webkit-flex;         /*safari用*/
        display: flex;
        width: 518px;
        margin-left: auto;
        margin-top: 5px;

    }

    /*メニューリストの共通スタイル*/
    #gNav li {
        padding: 0 10px;
        border-right: 3px solid black;
        text-align: center;
        width: 33.33%;
        display: block;
        border-radius: 50px;

    }
        
        /*リンクの一番最後のメニュー*/
        #gNav li:last-child {
           
            padding-right: 10px;
        }

    /*メニューリンクの共通スタイル*/
    #gNav a {
        color: black;
        display: block;
        font-size: 15px;
        font-weight: bolder;
        border-radius: 50px;
        text-decoration: none;
        
    }

    /*メニューの英文字スタイル*/
    #gNav a span {
        color: black;
        display: block;
        font-family: arial;
        font-size: 10px;
    }

    /*メニューリンクにマウスを乗せた時のスタイル*/
    #gNav a:hover {
        color: black;
        background-color: rgb(199, 97, 14);
        opacity: 1;

    }

    /*現在ページのメニュースタイル*/
    #gNav-right .current-menu-item {
        background-color: rgb(190, 50, 50);
       
    }

    

/*----------------------*/
/*5．コンテンツ
/*----------------------*/

    /*------------*/
    /*メイン画像にボタンの置き方*/
    /*--------------*/

    #contents .main_visual{
        width: 960px;
        position: relative;
    }

    #contents img{
        width: 100%;
    }

    .btn{
        width: 200px;
        height: 45px;
        text-align: center;
        border-radius: 3px;
        background-color: cornsilk;
        font-size: 20px;
        font-weight: bold;
        padding: 5px;
        position: absolute;
        bottom: 40px;
        right: 100px;
    }

    .btn a {
        color: black;
    }

    .text{
        width: 450px;
        font-size: 30px;
        font-weight: bolder;
        color: black;
        position: absolute;
        bottom: 100px;
        right: 10px;
    }

    /*コンテンツエリア外枠のスタイル*/
    #contents {
        margin-bottom: 0px;
    }
/*----------------------*/
/*6．フッター
/*----------------------*/

    /*エリア外枠スタイル*/
    #footer {
        background: black;
        color: burlywood;
        padding: 25px;
        display: -webkit-flex;        /*safari用*/
        display: flex;
    }

    /*エリア左側のボックス*/
    #footer-left {
        width: 400px;
    }

    /*エリア右側のボックス*/
    #footer-right {
        width: 510px;
    }

    /*ロゴ*/
    #footer_logo img {
        width: 230px;
        height: 40px;
        margin-bottom: 15px;
    }

    /*会社所在地*/
    #adress {
        font-size: 12px;
    }

     /*著作権表記*/
     #copyright {
        text-align: right;
        display: block;
    }
    

    

/*----------------------*/
/*7．フッターナヴィゲーション
/*----------------------*/

    /*エリア外枠のスタイル*/
    #fNav {
        margin-bottom: 30px;
    }

    /*メニューリストを囲む枠*/
    #fNav ul {
        display: -webkit-flex;         /*safari用*/
        display: flex;
        width: 518px;
        margin-left: auto;
    }

    /*メニューリストの共通スタイル*/
    #fNav li {
        padding: 0 10px;
        border-right: 3px solid burlywood;
       
        
    }

        /*リンクの一番最後のメニュー*/
        #fNav li:last-child {
            border-right: none;
            padding-right: 0;
        }

    /*メニューリンクの共通スタイル*/
    #fNav a {
        color: cornsilk;
        text-decoration: none;
    }

    /*メニューリンクにマウスを乗せた時のスタイル*/
    #fNav a:hover {
        color: black;
        background-color: burlywood;
        opacity: 1;
    }


/*----------------------*/
/*8．トップページ専用スタイル
/*----------------------*/

    /*ニュースリンクスタイル*/
    .news {
     background-color: burlywood;
     display: block;
     width: 100%;
     
    }

    /*ニュースリンクにマウスを乗せた時のスタイル*/
    .news a:hover {
        color: black;
        background-color:rgb(199, 97, 14);
        opacity: 1;
    }

    .news p {
        font-weight: bold;
        padding: 5px;
    }

/*----------------------*/
/*９．事業内容ページ専用スタイル
/*----------------------*/



/*----------------------*/
/*10．会社概要ページ専用スタイル
/*----------------------*/

/*----------------------*/
/*11．プライバシーポリシースタイル専用スタイル
/*----------------------*/

/*----------------------*/
/*12．お問い合わせページ専用スタイル
/*----------------------*/

    /*中見出し*/
    h2{
        background-color: brown;
        color: cornsilk;
        font-size: 18px;
        margin-bottom: 0px;
        padding: 0.5em 1em;
    }

    /*お問い合わせフォームのフレーム背景*/
    #mail-form{
        background-color: brown;
    }

    /*お問い合わせフォームのフレーム*/
    #mail-form iframe{
        width: 100%;
        height: 1100px;
    }

/*レスポンシブル*/

    @media only screen and (max-width:425px) {
        
        h1 {
            padding: 50px 10px;
        }
        
        #gNav ul {
            display: block;
            flex-wrap: nowrap;
            text-align: center;
            

        }

        #gNav li {
            padding: 30px 30px;
            margin-left: auto;
            border-right: 3px solid black;
            text-align: center;
            width: 33.33%;
            display: block;
            flex-wrap: nowrap;
            border-radius: 50px;
    
        }

        #gNav a {
            font-size: 20px;
        }

        #gNav {
            padding: 50px 0Px;
        }

        .btn{
        width: 200px;
        height: 45px;
        text-align: center;
        border-radius: 3px;
        background-color: cornsilk;
        font-size: 20px;
        font-weight: bold;
        padding: 5px;
        position: absolute;
        bottom: 40px;
        right: 100px;
        }

        .btn a {
        color: black;
        }

        .news {
            padding: 50px 30px;
            
        }

        .news p {
            font-size: 20px;
        }

        /*メニューリストを囲む枠*/
        #fNav ul {
        display: block;
        flex-wrap: nowrap;
        text-align: center;
        width: 518px;
        margin-left: auto;
        }

        /*メニューリストの共通スタイル*/
        #fNav li {
        padding: 30px 10px;
        border-bottom: 5px solid burlywood;
        border-right: none;
       
        
        }

        /*リンクの一番最後のメニュー*/
        #fNav li:last-child {
            border-right: none;
            padding-right: 0;
        }

        /*メニューリンクの共通スタイル*/
        #fNav a {
        font-size: 20px;
        }

        #fNav {
            padding: 50px 0px;
        }


    }