@charset "UTF-8";
/* CSS Document */

html, 
html * {
    position: relative; 
    
	padding: 0;
	margin: 0;
	box-sizing: border-box;
	font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans","BIZ UDPGothic",
    "Meiryo",sans-serif;
    -webkit-text-size-adjust: 100%;/*←スマホの文字の大きさ自動調整を解く！*/
}

/*スマホの文字の大きさ自動調整を解く記述を追加　-webkit-*/
body {
	margin-left: auto;
	margin-right: auto;
	background: #ffffff;
        /*font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans","BIZ UDPGothic",
        "Meiryo",sans-serif; */
        /*-webkit-text-size-adjust: 100%; */
        /*←スマホの文字の大きさ自動調整を解く！*/
}

main{
    margin-top: 60px;
}

/*商品一覧概要の四分の一カラム*/
    .col-pr-quarter {
		width: 50%;
	}

/*ヘッダ固定枠設定===デスクトップの設定はdesktopview参照*/
div#header-fixed{
    position: fixed;            /* ヘッダーの固定 */
    top: 0px;                   /* 位置(上0px) */
    left: 0px;                  /* 位置(右0px) */
    width: 100%;                /* 横幅100%　*/
    height: 65px;              /* 縦幅65px デスクトップは120px*/
    text-align: center;
    z-index: 50;
}
 
 
div#header-bk { 
	padding:2% 3%;       /* 上10px、下10pxをあける */
	height:94%;              /* 縦の高さ110px */
	width:100%;                /* 横の幅を100% */
    background-color: #303DAE;
}

div#header{
    width: 100%;
    height: 100%;
    
}
/*ヘッダ固定設定ここまで*/

header {
    height: 100px;
	padding: 10px 20px;
    background-color: #303DAE;
}

/*ヘッダのロゴ*/
.logo{
    float: right;
    margin-left: auto;
	margin-right: auto;
    margin-bottom: 5px;
	display: block;
	width: 140px;
}

.cart{
    float: left;
    width: 8%;
    margin-left: 10px;
    display: block;
}

.h_menu{
    float:left;
}

/*ハンバーガーメニュー部分*/
        #nav-drawer {
          position: relative;
        }

        /*チェックボックス等は非表示に*/
        .nav-unshown {
          display:none;
        }

        /*アイコンのスペース*/
        #nav-open {
          display: inline-block;
          width: 30px;
          height: 22px;
          vertical-align: middle;
        }

        /*ハンバーガーアイコンをCSSだけで表現*/
        #nav-open span, #nav-open span:before, #nav-open span:after {
          position: absolute;
          height: 3px;/*線の太さ*/
          width: 25px;/*長さ*/
          border-radius: 3px;
          background: #ffffff;
          display: block;
          content: '';
          cursor: pointer;
        }
        #nav-open span:before {
          bottom: -8px;
        }
        #nav-open span:after {
          bottom: -16px;
        }

        /*閉じる用の薄黒カバー*/
        #nav-close {
          display: none;/*はじめは隠しておく*/
          position: fixed;
          z-index: 99;
          top: 0;/*全体に広がるように*/
          left: 0;
          width: 100%;
          height: 100%;
          background: black;
          opacity: 0;
          transition: .3s ease-in-out;
        }

        /*中身*/
        #nav-content {
          overflow: auto;
          position: fixed;
          top: 0;
          left: 0;
          z-index: 9999;/*最前面に*/
          width: 90%;/*右側に隙間を作る（閉じるカバーを表示）*/
          max-width: 220px;/*最大幅（調整してください）*/
          height: 100%;
          background: #A0A0A0;/*背景色*/
            border-bottom-right-radius: 10px;
          transition: .3s ease-in-out;/*滑らかに表示*/
          -webkit-transform: translateX(-105%);
          transform: translateX(-105%);/*左に隠しておく*/
        }

        /*チェックが入ったらもろもろ表示*/
        #nav-input:checked ~ #nav-close {
          display: block;/*カバーを表示*/
          opacity: .5;
        }

        #nav-input:checked ~ #nav-content {
          -webkit-transform: translateX(0%);
          transform: translateX(0%);/*中身を表示（右へスライド）*/
          box-shadow: 6px 0 25px rgba(0,0,0,.15);
        }

        #nav-content ul{
            list-style-type: none;
        }

        #nav-content ul li a {
            text-decoration: none;
            color: #ffffff;
            text-align: center;
            display: block;
            padding: 10px;
            font-size: 14px;
            /*background-color: #ffffff;  */
            border-bottom: 1px #ffffff solid;
            margin-left: 5px;
            margin-bottom: 5px;
        }
/*ハンバーガーメニューここまで*/


/*以下ハンバーガーメニューの際は不要*/
        .style-logo {
            margin-left: auto;
            margin-right: auto;
            margin-bottom: 5px;
            display: block;
            width: 120px;
        }


        .style-nav {
            float: right;
        }

        .style-nav ul li {
		    display: inline-block;
	    }


        .style-nav ul {
            list-style-type: none;
            text-align: right;
        }

        .style-nav ul li a {
            width: 50px;
            text-decoration: none;
            color: #ffffff;
            text-align: center;
            display: block;
            padding: 0px 5px;
            font-size: 14px;
            margin-right: 5px;
        }
/*ここまでハンバーガーメニューの際は不要*/


img {
	width: 100%;
	max-width: 100%;
	height: auto;
	vertical-align: middle;
}
    
/*機能アイコンのimg設定*/
.box-icon-center img {
    height: 40px;
}

.box-icon-center2 img {
    width: 50%;
}


footer {
	padding: 20px 30px;
	background-color: #303DAE;
}




/*全てのリンクのホバー状態の透明度*/
a:hover {
	opacity:0.7;
}


.hero {
	background-image: url("images/top_2nd.jpg");
	background-size: cover;
	padding: 35%;
	color: #60D2F8;
	text-align: center;
    
}

                    h1 {
                        font-size: 28px;
                        font-weight: 600;
                        color: #303DAE;
                        margin-bottom: 12px;
                    }

                    h2 {
                        font-size: 25px;
                        font-weight: 600;
                        line-height:150%;
                        margin-bottom: 12px;
                    }

                    h3 {
                        font-size: 22px;
                        font-weight: 400;
                        margin-bottom: 12px;
                    }

                    h4 {
                        font-size: 18px;
                        font-weight: 300;
                        margin-bottom: 20px;
                        line-height:150%;
                        margin-bottom: 10px;
                    }

                    h5 {
                        font-size: 16px;
                        font-weight: 300;
                        margin: 10px 0px;
                        line-height:150%;
                        margin-bottom: 10px;
                    }



                    p {
                        font-size: 16px !important;
                        font-weight: 300;
                        margin-bottom: 10px;
                        line-height: 1.5em;
                    }

/*10ポイントの補足説明用*/
.siyou {
    font-size: 12px !important;
    font-weight: 200;
	margin-bottom: 0px;
    line-height: 1.5em;
}


/*お知らせその他のリンクボタン*/
                    .button-orange {
                        background: #F9CD2C;
                        border: 2px #F9CD2C solid;
                        padding: 12px 10px;
                        border-radius: 0px;
                        color: #ffffff;
                        text-decoration: none;
                        font-size: 18px;
                        font-weight: 500;
                    }

                    .button-lblue {
                        background: #60D2F8;
                        border: 2px #60D2F8 solid;
                        padding: 12px 10px;
                        border-radius: 0px;
                        color: #FFFFFF;
                        text-decoration: none;
                        font-size: 18px;
                        font-weight: 500;
                    }

                    .button-blue {
                        background: #303DAE;
                        border: 2px #303DAE solid;
                        padding: 12px 10px;
                        border-radius: 4px;
                        color: #FFFFFF;
                        text-decoration: none;
                        font-size: 18px;
                        font-weight: 500;
                    }

                    .button-red {
                        background: #d80000;
                        border: 2px #d80000 solid;
                        padding: 12px 10px;
                        border-radius: 0px;
                        color: #FFFFFF;
                        text-decoration: none;
                        font-size: 18px;
                        font-weight: 500;
                    }



/*商品一覧ページの案内に使用*/

a .button-blue:hover{
    opacity:0.7;
}

/*カートリンクボタン*/
.button-cart {
    background: #03B9F6;
    border: 2px #99E2FA solid;
	padding: 12px 50px;
	border-radius: 5px;
	color: #FFFFFF;
	text-decoration: none;
    font-size: 16px;
}
.button-cart:hover{
    opacity:0.7;
    }

/*オプションリンクボタン*/
.button-option {
    background: #ffffff;
	padding: 8px 35px;
    border: #03B9F6 1px solid;
	border-radius: 5px;
	color: #03B9F6;
	text-decoration: none;
    font-size: 14px;
}
.button-no-option {
    background: #ffffff;
	padding: 8px 35px;
    border: #dddddd 1px solid;
	border-radius: 5px;
	color: #bbbbbb;
	text-decoration: none;
    font-size: 14px;
}


/*解説用のボックス　文字大きさを指定している*/
.info-box-lgray-center {
	background-color: #E4E4E4;
	color: #000000;
	padding: 30px 20px 60px;
	text-align: center;
    font-weight: 200;
    font-size: 14px;
}

.info-box-lgray-left {
	background-color: #E4E4E4;
	color: #000000;
	padding: 30px 20px 60px;
	text-align: left;
    font-weight: 200;
    font-size: 14px;
}

.info-box-white-center {
	background-color: #FFFFFF;
	color: #000000;
	padding: 20px 20px 20px;
	text-align: center;
    font-weight: 200;
    font-size: 14px;
}

.info-box-white-left {
	background-color: #FFFFFF;
	color: #000000;
	padding: 30px 20px 60px;
	text-align: left;
    font-weight: 200;
    font-size: 14px;
}

/*解説以外誘導用のボックス　文字大きさを指定していない*/
                    .box-center {
                        color: #000000;
                        padding: 10px ;
                        margin: 10px 10px;
                        text-align: center;
                    }

                    .box-center video {
                        width: 100%;
                    }

.box-left {
	color: #000000;
    padding: 10px ;
	margin: 10px 10px;
	text-align: left;
}
.box-hayami-right {
    background: #F58EC8;
	color: #ffffff;
    padding: 5px ;
	margin: 5px 20px;
	text-align: center;
    border-radius: 5px;
    font-size: 16px;
    font-weight: 400;
    float: right;
}

                    .box-white-center {	
                        background-color: #FFFFFF;
                        color: #000000;
                        padding: 10px ;
                        margin: 0px 10px;
                        text-align: center;
                    }

                    .box-lineG-left {	
                         background-color: #FFFFFF;
                         border-left: solid #74D238 8px;
                         color: #000000;
                         padding: 10px 10px 10px 20px;                
                         margin: 20px 10px;               
                         text-align: left;                              
                    }

                    .box-lineO-left {	
                         background-color: #FFFFFF;
                         border-left: solid #F9CD2C 8px;
                         color: #000000;
                         padding: 10px 10px 10px 20px;               
                         margin: 20px 10px;               
                         text-align: left;                              
                    } 

                    .box-white-left {	
                         background-color: #FFFFFF;
                         color: #000000;
                         padding: 10px 20px;               
                         margin: 20px 10px;               
                         text-align: left;                              
                    }                               
              
.box-lgray-center {
	background-color: #EAEAEA;
	color: #000000;
    padding: 10px 20px;
	margin: 10px 10px;
	text-align: center;
}


/*box内の左右スペース　各5%*/
.space_left{
    width: 5%;
    float: left;
}
.space_center{
    width: 90%;
    float: left;
}
/*pr追加説明の部分*/
.space_center_add{
    width: 90%;
    padding: 10px 15px;
    background-color:#E2F7FA; 
    border-radius: 10px;
    margin-bottom: 20px;
    float: left;
}
.space_center_add ol{
    margin-left: 20px;
}
.space_center_add h4{
    padding: 5px;
    background-color: #03B9F6;
    border-radius: 5px;
    text-align: center;
    color: #ffffff;
}
.space_center_add h5{
    padding: 0px;
    border-radius: 5px;
    text-align: center;
    color: cornflowerblue;
}
/*box内の左右スペース付きまとめたボックス
デスクトップは左右空き大*/
.space_LR_left{
    width: 90%;
    padding: 0px 5px;
    margin: 5px auto;
    text-align: left;
}

/*小さな補足説明用のボックス　class="shiyou"を包む*/
.right-box-small-right {
    font-size: 12px !important;
	color: #000000;
	margin: 10px 20px;
	text-align: right;
}

.right-box-small-center {
    font-size: 12px !important;
	color: #000000;
	margin: 10px 20px;
	text-align: center;
}

.right-box-small-left {
    font-size: 13px !important;
    font-weight: 200;
    line-height: 1.5em;
	color: #000000;
	margin: 3px 2px;
	text-align: left;
}
.right-box-option-left {
    font-size: 12px !important;
    font-weight: 200;
    line-height: 1.5em;
	color: darkolivegreen;
	margin: 3px 2px;
	text-align: left;
}

/*gifアニメ中央挿入のbox*/
.pr_anime_center{
    display: flex: none;
    justify-content: center;
	background-color: #EAEDEF;
	color: #000000;
	padding: 5px 10%;
    margin: 10px 0px;
	text-align: center;
}


/*商品種類など頁を渡るボックス*/
.pr-title-lgray-center {
    display: flex;
    justify-content: center;
	background-color: #EAEDEF;
	color: #000000;
	padding: 5px 10%;
    margin: 10px 0px;
	text-align: center;
    font-size: 28px;
    font-weight: 300;
}

                    .title-lblue-center {
                        display: flex;
                        justify-content: center;
                        background-color: #60D2F8;
                        color: #ffffff;
                        padding: 5px 10%;
                        margin: 10px 0px;
                        text-align: center;
                        font-size: 20px;
                        font-weight: 600;
                        text-decoration: none;
                    }

                    .title-green-center {
                        display: flex;
                        justify-content: center;
                        background-color: #74D238;
                        color: #ffffff;
                        padding: 5px 10%;
                        margin: 10px 0px;
                        text-align: center;
                        font-size: 20px;
                        font-weight: 600;
                        text-decoration: none;
                    }

                    .title-red-center {
                        display: flex;
                        justify-content: center;
                        background-color: #d80000;
                        color: #ffffff;
                        padding: 5px 10%;
                        margin: 10px 0px;
                        text-align: center;
                        font-size: 20px;
                        font-weight: 600;
                        text-decoration: none;
                    }

                    .title-orange-center {
                        display: flex;
                        justify-content: center;
                        background-color: #ff7f2f;
                        color: #ffffff;
                        padding: 5px 10%;
                        margin: 10px 0px;
                        text-align: center;
                        font-size: 20px;
                        font-weight: 600;
                        text-decoration: none;
                    }


.pr-title-white-center {
	background-color: #ffffff;
	color: #000000;
	padding: 5px;
    margin: 10px auto;
	text-align: center;
}


/*カートリンクのボックス*/
.box-cart-center {
	background-color: #ffffff;
	color: #000000;
	padding: 5px 5px 35px;
	text-align: center;
    border-bottom: #D0D0D0 3px dotted;
}

/*アイコンのボックス*/
.box-icon-center {
	display: flex;
    justify-content: center;
    background-color: #F7F7F7;
	color: #000000;
	padding: 5px 95px;
    border-radius: 10px;
    width: 240px;
    height: 50px;
    margin: 20px auto;
    
}
.box-pr-icon-center {
	display: flex;
    justify-content: center;
    background-color: #F7F7F7;
	color: #000000;
	padding: 5px 115px;
    border-radius: 10px;
    width: 300px;
    height: 50px;
    margin: 10px auto;
    
}

.box-icon-prtitle {
	display: flex;
    justify-content: center;
    background-color: #eeeeee;
	color: #000000;
	margin-left: 5px;
    margin-right: 5px;
    width: 50px;
    height: 50px;
}

/*商品選択フォームのホワイトボックス*/
.pr-form-white-center {	
    background-color: #FFFFFF;
	color: #000000;
    padding: 10px 40px;
	margin: 15px 20px 30px;
	text-align: center;
}
        /*商品選択フォームSUBMITの書きかえ*/
.pr-form-white-center input[type=submit] {
      appearance:none;
      outline:none;
      border:none;
  
    background: #03B9F6;
    border: 2px #99E2FA solid;
	padding: 12px 70px;
	border-radius: 5px;
	color: #FFFFFF;
	text-decoration: none;
    font-size: 16px;
}
.pr-form-white-center input[type=submit]:hover{
    opacity: 0.7;
}

/*商品選択フォームのバックグラウンド入りボックス*/
.pr-form-bg-center {	
    background-image: url("images/bg/bg_dot_b.svg");
    background-size: 5%;
	color: #000000;
    padding: 10px 20px;
	margin: 15px auto 30px;
	text-align: left;
}

.pr-form-bg-center form p{
    line-height:1.7em;
}

        /*商品選択フォームSUBMITの書きかえ*/
.pr-form-bg-center input[type=submit] {
      appearance:none;
      outline:none;
      border:none;
  
    background: #03B9F6;
    border: 2px #99E2FA solid;
	padding: 12px 70px;
	border-radius: 5px;
	color: #FFFFFF;
	text-decoration: none;
    font-size: 16px;
}
.pr-form-bg-center input[type=submit]:hover{
    opacity: 0.7;
}
/*-----------------*/


.pr-form-white-left {	
    background-color: #FFFFFF;
	color: #000000;
    padding: 10px 10px;
	margin: 15px 10px 15px;
	text-align: left;
}


/*お知らせの各ボックス*/
.news_date{
    float: left;
    background-color: #3D9FFC;
    width: 16%;
    padding: 1%;
    margin: 1%;
    font-size: 14px;
    color: #ffffff;
    border-top-left-radius: 10px;
}

.news_content{
    float: left;
    background-color: #f5f5f5;
    width: 79%;
    padding: 1%;
    margin: 1%;
    font-size: 14px;
    color: #606060;
}

/*社歴のボックス*/
.history_date{
    float: left;
    width: 20%;
    padding: 0%;
    margin-right: 5%;
    font-size: 12px;
    color: #000000;
}

.history_content{
    float: left;
    width: 100%;
    padding: 0% 1% 0% 2%;
    margin: 0%;
    font-size: 12px;
    color: #606060;
}

/*問合せの各ボックス*/

    /*ブラウザのスタイルを消す*/
input[type="text"],textarea {
  margin: 0;
  padding: 0;
  background: #ffffff;
  border: none;
  border-radius: 5px;
  outline: none;
    font-size: 13px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
input[type="submit"],input[type="reset"]{
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

    /*問合せ等フォームスタイル*/
                    .faq_item_blue{
                        float: left;
                        background-color: #3D9FFC;
                        width: 25%;
                        padding: 1%;
                        margin: 1%;
                        font-size: 14px;
                        color: #ffffff;
                        border-top-left-radius: 10px;
                    }
                    .faq_item_green{
                        float: left;
                        background-color: #63CF5C;
                        width: 25%;
                        padding: 1%;
                        margin: 1%;
                        font-size: 14px;
                        color: #ffffff;
                        border-top-left-radius: 10px;
                    }

                    .faq_content{
                        float: left;
                        background-color: #f5f5f5;
                        width: 70%;
                        padding: 1%;
                        margin: 1%;
                        font-size: 16px;
                        color: #606060;
                    }

                    .faq_submit_center input[type=submit] {  
                        background: #3D9FFC;
                        border: 2px #99E2FA solid;
                        padding: 12px 50px;
                        border-radius: 5px;
                        color: #FFFFFF;
                        text-decoration: none;
                        font-size: 16px;
                    }
                    .faq_submit_center input[type=reset] {  
                        background: #F8D20D;
                        border: 2px #F6E56F solid;
                        padding: 12px 35px;
                        border-radius: 5px;
                        color: #FFFFFF;
                        text-decoration: none;
                        font-size: 16px;
                        margin-left: 20px;
                    }

                    .faq_submit_center{
                        display: flex;
                        justify-content: center;
                        background-color: #EAEDEF;
                        color: #000000;
                        padding: 5px 10%;
                        margin: 10px 0px;
                        text-align: center;
                    }

                    .faq_question{
                        background-color: #FBC7E3;
                        color: #000000;
                        padding: 10px 10px;
                        margin: 5px 10px;
                        text-align: center;
                        font-size: 16px;
                        font-weight: 400;
                    }
                    .faq_answer{
                        background-color: #f5f5f5;
                        color: #000000;
                        padding: 10px 40px;
                        margin: 5px 10px 10px 10px;
                        text-align: left;
                        font-size: 16px;
                        font-weight: 200;
                    }

                    .col {
                        width: 100%;
                    }

                    .col2 {
                            width: 50%;
                            float: left;
                            padding: 0px 7px 10px;
                        }




    
/*以下フッター*/
.footer-text {
    margin-left: 20px;
	font-size: 11px;
	margin-bottom: 15px;
    color: #ffffff;
}



/*PUT a SPELL*/
                    .row:before, .row:after {
                        content: "";
                        display: table;
                    }

                    .row:after {
                        clear: both;
                    }


/*topのswiperのイメージをズームアップ*/
@keyframes zoomUp {
  0% {
    transform: scale(0.85);
  }
  100% {
    transform: scale(1.1);
  }
}

.swiper-slide-active .slide-img,
.swiper-slide-duplicate-active .slide-img,
.swiper-slide-prev .slide-img{
  animation: zoomUp 10s linear 0s 1 normal both;  
}
/*上記zoomup 10s は画像の切り替え時間よりも大きな適当な秒数*/
/*imgタグだと下に隙間ができるのでblockに。*/
.slide-img img{
  display: block;
}



/*=================================Tablet View==========================*/

@media (min-width: 768px){
	
	body {
		max-width: 960px;
	}      
    
                    .logo{
                        float: right;
                        margin-left: auto;
                        margin-right: auto;
                        margin-bottom: 5px;
                        display: block;
                        width: 200px;
                    }
    
    .cart{
        float: left;
        width: 5%;
        margin-left: 40px;
    }
	
	.style-nav ul li {
		display: inline-block;
	}
	
	.style-nav ul {
		text-align: right;
	}
	
                        .col-md-one-half {
                            width: 50%;
                        }

                        /*商品一覧概要の四分の一カラム*/
                        .col-pr-quarter {
                            width: 25%;
                        }


                        .col {
                            float: left;
                            padding: 5px 7px 10px;
                        }
    
    /*ヘッダ固定枠設定*/
    div#header-fixed{
    position: fixed;            /* ヘッダーの固定 */
    top: 0px;                   /* 位置(上0px) */
    left: 0px;                  /* 位置(右0px) */
    width: 100%;                /* 横幅100%　*/
    height: 90px;              /* 縦幅120px */
    z-index: 50;
}
 
 
    div#header-bk { 
	padding:2% 3%;       /* 上10px、下10pxをあける */
	height:94%;              /* 縦の高さ110px */
	width:100%;                /* 横の幅を100% */
    background-color: #303DAE;
}

div#header{
    height: 100%;
    
}
/*ヘッダ固定設定ここまで*/
    
}

/*=================================Desktop View===========================*/

@media (min-width: 961px){
	
	body {
		max-width: 1200px;
	}
    
    main{
    margin-top: 110px;
}      
    
                    .logo{
                    float: right;
                    margin-left: auto;
                    margin-right: auto;
                    margin-bottom: 5px;
                    display: block;
                    width: 250px;
                    }
    
/*box内の左右スペース付きまとめたボックス
デスクトップは左右空き大*/
.space_LR_left{
    width: 60%;
    margin: 5px auto;
    text-align: left;
}
    
    
/*以下ハンバーガーメニューの際は不要*/	
	.style-logo {
		float: left;
	}
	
	.style-nav {
		float: right;
	}
/*ここまでハンバーガーメニューの際は不要*/    
    
	
                        .col-lg-one-fourth {
                            width: 25%;
                        }

                        /*商品一覧概要の四分の一カラム*/
                        .col-pr-quarter {
                            width: 25%;
                        }
    
    /*10ポイントの補足説明用*/
    .siyou {
        font-size: 14px;
        font-weight: 200;
        margin-bottom: 0px;
        line-height: 1.5em;
    }
    
    .style-logo {
	margin-left: auto;
	margin-right: auto;
    margin-bottom: 5px;
	display: block;
	width: 200px;
    }
    
    .box-icon-center2 img {
    width: 25%;
}
    
/*ヘッダ固定枠設定*/
    div#header-fixed{
    position: fixed;            /* ヘッダーの固定 */
    top: 0px;                   /* 位置(上0px) */
    left: 0px;                  /* 位置(右0px) */
    width: 100%;                /* 横幅100%　*/
    height: 100px;              /* 縦幅120px */
    z-index: 50;
}
 
 
    div#header-bk { 
	padding:2% 3%;       /* 上10px、下10pxをあける */
	height:94%;              /* 縦の高さ110px */
	width:100%;                /* 横の幅を100% */
    background-color: #303DAE;
}

div#header{
    height: 100%;
    
}
/*ヘッダ固定設定ここまで*/
    
    
}