@charset "UTF-8";


@media screen and (min-width: 768px){

    #header{
        margin: 0;
    }
    #contents,
    .section{
        margin: 0;
        overflow: hidden;
    }
    h2{
        margin-bottom: 2em;
        text-align: center;
    }
    h2 img{
        display: block;
        margin: 0 auto;
    }
    h2 span{
        display: block;
    }
    h2 .h2_ja{
        margin-bottom: 9px;
    }
    h2 .h2_en{
        margin-top: 7px;
    }
    .border-area{
        margin: 0 auto;
        height: 5px;
    }
    .border-animation{
        width: 0;
        height: 100%;
        background: #fcffcf;
    }
    #senior .border-animation,
    #gallery .border-animation{
        background: #f8fe97;
    }
    .link_more{
        display: block;
        width: 210px;
        height: 57px;
        background: url('../../img/link_more.png') no-repeat;
    }
    .link_more:hover{
        background-image: url('../../img/link_more_on.png');
    }
    .link_more img{
        display: none;
    }
    #seidoAndFaq .link_more{
        margin: 0 auto;
    }
    /* メインビジュアル */
    #mainVisual {
        position: relative;
        height: 500px;
    }
    #mainVisual li{
        display: none;
        height: 600px;
    }
    #mainVisual li.first{
        display: block;
    }
    #mainVisual .bx-wrapper {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
    }
    #mainVisual .bx-viewport {
        height: 500px !important;
    }
    #mainVisual .bx-controls{
        position: absolute;
        right: 0;
        bottom: 15px;
        width: 300px;
        z-index: 9999;
    }
    #mainVisual .bx-pager-item{
        float: left;
        width: 24px;
        height: 24px;
        margin-left: 17px;
    }
    #mainVisual .bx-pager-item a{
        display: block;
        height: 100%;
        text-indent: -9999px;
        background: url('../../img/slidebtn_off.png') no-repeat;
    }
    #mainVisual .bx-pager-item a:hover,
    #mainVisual .bx-pager-item a.active{
        background: url('../../img/slidebtn_on.png');
    }
    #bgImage{
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        min-width: 980px;
    }
    #bgImage li{
        display: none;
        height: 500px;
    }
    #bgImage li a{
        display: block;
        height: 500px;
    }
    #bgImage .item1 a{
        background: url('../../img/mainvisual01.jpg') center no-repeat;
    }
    #bgImage .item2 a{
        background: url('../../img/mainvisual02.jpg') center no-repeat;
    }
    #bgImage .item3 a{
        background: url('../../img/mainvisual03.jpg') center no-repeat;
    }
    #bgImage .item4 a{
        background: url('../../img/mainvisual04.jpg') center no-repeat;
    }
    #bgImage .item5 a{
        background: url('../../img/mainvisual05.jpg') center no-repeat;
    }
    #mainVisual .inner {
        position: relative;
        height: 500px;
    }
    #mainVisual #text {
        position: absolute;
        top: 80px;
        right: 0;
    }
    #mainVisual #name {
        position: absolute;
        bottom: 60px;
        left: 0;
    }
    
    /* ダイバーシティ */
    #diversity{
        padding: 40px 0 0;
        background: #CEEFFB;
        border-bottom: 40px solid #90c4dd;
    }
    #diversity h2{
        width: 300px;
        margin: 0 auto 22px;
    }
    #diversity .pc_column2_1{
        background: url('../../img/diversity_bg.gif') center bottom repeat-x;
    }
    #diversity .pc_left_col p{
        margin-top: 100px;
		font-size:16px;
		line-height:2.8;
    }
    #diversity .figure{
        margin-bottom: 38px;
    }
    #diversity .link_more{
        margin:0 auto 20px;
    }



    /* 活躍する女性社員 */
    #senior{
        padding: 40px 0 0;
    }
    #senior h2{
        width: 360px;
        margin: 0 auto;
    }
    #starArea{
        position: relative;
        width: 980px;
        height: 97px;
        margin: -70px auto 0;
    }
    #starL{
        position: absolute;
        top: 0;
        left: 500px;
        opacity: 0;
    }
    #starR{
        position: absolute;
        top: 0;
        right: 500px;
        opacity: 0;
    }
    #senior li{
        position: relative;
        float: left;
        width: 25%;
        padding-top: 100px;
    }
    #senior .flip_item{
        height: 340px;
    }
    #senior .inner{
        overflow: visible;
    }
    #senior .flip_wrapper .fukidashi{
        position: absolute;
        top: -10px;
        left: 0;
        z-index: 500;
    }
    #senior .flip_wrapper[rel="0"] .fukidashi{
        left: -70px;
    }
    #senior .flip_wrapper[rel="1"] .fukidashi{
        left: -70px;
    }
    #senior .flip_wrapper[rel="2"] .fukidashi{
        left: 120px;
    }
    #senior .flip_wrapper[rel="3"] .fukidashi{
        left: -80px;
    }
    #senior .flip_wrapper[rel="4"] .fukidashi{
        left: 130px;
    }
    .shadow_show_wrap{
        position: relative;
        overflow: hidden;
        height: 180px;
        margin-bottom: 30px;
        text-align: center;
        background: url('../../img/icon_shadow.jpg') center bottom no-repeat;
    }

    /* 活躍する女性社員 */
    #seido .shadow_show_item,
    #faq .shadow_show_item{
        position: absolute;
        top: 165px;
        left: 0;
        width: 100%;
    }
    .action #seido .shadow_show_item{
        top: 10px;
    }
    .action #faq .shadow_show_item{
        top: 10px;
    }

    /* 制度、FAQ */
    #seidoAndFaq{
        padding: 40px 0;
        background: #CEEFFB;
    }
    #seidoAndFaq .col,
    #seidoAndFaq .column1_1{
        margin-bottom: 0;
    }

    /* フォトギャラリー */
    #gallery{
        padding: 40px 0 0;
    }
    #gallery h2{
        width: 340px;
        margin: 0 auto;
    }
    #gallery .col{
        height: 482px;
        margin-bottom: 0;
    }
    #gallery .column1_1{
        margin-bottom: 0;
    }
    #galleryLeft{
        position: relative;
    }
    #galleryLeft #photo {
        position: relative;
        top: 0;
        right: 54px;
    }
    #galleryLeft #photogallery01{
        position: absolute;
        top: 220px;
        left: 120px;
        z-index: 304;
    }
    #galleryLeft #photogallery02{
        position: absolute;
        top: 220px;
        left: 120px;
        z-index: 303;
    }
    #galleryLeft #photogallery03{
        position: absolute;
        top: 220px;
        left: 120px;
        z-index: 300;
    }
    #galleryLeft #photogallery04{
        position: absolute;
        top: 220px;
        left: 120px;
        z-index: 301;
    }
    #galleryLeft #woman {
        position: absolute;
        left: 0;
        bottom: 0;
        z-index: 9999;
    }
    #photoSlider .link_more{
        margin: 0 auto;
    }
    #gallery .bx-wrapper{
        width: 395px;
        height: 282px;
        margin: 80px auto 33px !important;
    }
    #photoSlider .bx-viewport{
        border: 10px solid #f6f6f6;
    }
	#photoSlider .bx-viewport img{
		width:100%;
	}
    #photoSlider .bx-controls{
        width: 100%;
        margin: -150px 0 0 10px;
    }
    #photoSlider .bx-controls-direction{
        position: relative;
    }
    #photoSlider .bx-prev,
    #photoSlider .bx-next{
        position: absolute;
        width: 45px;
        height: 45px;
        text-indent: -9999px;
        z-index: 7000;
    }
    #photoSlider .bx-prev:hover,
    #photoSlider .bx-next:hover{
        opacity: 0.8;
    }
    #photoSlider .bx-prev{
        left: -35px;
        background: url('../../img/icon_arrow_maru_left.png');
    }
    #photoSlider .bx-next{
        right: -35px;
        background: url('../../img/icon_arrow_maru_right.png');
    }
    #photoSlider ul{
    }


}


@media screen and (max-width: 767px){

    #header{
        margin: 0;
    }
    .section{
        margin: 0;
        overflow: hidden;
    }
    h2{
        text-align: center;
    }
    h2 span{
        display: block;
    }
    h2 img{
        display: block;
        margin: 0 auto;
        vertical-align: top;
    }
    .h2_ja{
        margin-bottom: 5px;
    }
    .h2_en{
        display: none;
    }
    .border-area{
        margin: 0 auto;
        height: 2px;
    }
    .border-animation{
        width: 0;
        height: 100%;
        background: #fcffcf;
    }
    #senior .border-animation,
    #gallery .border-animation{
        background: #f8fe97;
    }

    .link_more{
        display: block;
        width: 185px;
        margin: 0 auto;
    }
    .link_more img{
        width: 100%;
    }

    /* メインビジュアル */
    #mainVisual{
        position: relative;
    }
    #mainVisual li{
        display: none;
    }
    #mainVisual .first{
        display: block;
    }
    .resize #mainVisual .bx-viewport{
        height: 100% !important;
    }
    #mainVisual .bx-controls{
        position: absolute;
        right: 13px;
        bottom: 15px;
        width: 130px;
        z-index: 9000;
    }
    #mainVisual .bx-pager-item{
        float: left;
        width: 13px;
        height: 13px;
        margin-left: 13px;
    }
    #mainVisual .bx-pager-item a{
        display: block;
        height: 100%;
        text-indent: -9999px;
        background: url('../../img/slidebtn_off.png') no-repeat;
        background-size: 13px;
    }
    #mainVisual .bx-pager-item a.active{
        background-image: url('../../img/slidebtn_on.png');
    }
    #bgImage{
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
    #bgImage li{
        /*display: none;*/
        width: 100%;
        height: 210px;
    }
    #bgImage a{
        display: block;
    }
    #bgImage img{
        width: 100%;
    }

    #mainVisual .inner{
        position: relative;
        height: 100%;
        margin-top: -210px;
    }
    #text{
        position: absolute;
        top: 28px;
        right: 13px;
        height: 58px;
    }
    #text img{
        height: 58px;
    }
    #name{
        position: absolute;
        left: 13px;
        bottom: 15px;
        height: 58px;
    }
    

    /* ダイバーシティ */
    #diversity{
        padding: 20px 0;
        background: #ccedff;
    }
    #diversity h2{
        width: 160px;
        margin: 0 auto 22px;
    }
    #diversity .h2_ja{
        width: 142px;
    }
    #diversity p{
        margin-bottom: 1em;
    }
    #diversity p img{
        height: 68px;
    }
    #diversity .pc_right_col{
        background: url('../../img/diversity_bg.gif') center bottom repeat-x;
        background-size: 320px 82px;
    }
    #diversity .figure{
        text-align: center;
    }
    #diversity .figure img{
        width: 60%;
        max-width: 320px;
    }

    /* 活躍する女性社員 */
    #senior{
        padding: 20px 0;
    }
    #senior h2{
        width: 180px;
        margin: 0 auto;
    }
    #senior .h2_ja{
        width: 175px;
    }
    #starArea{
        position: relative;
        width: 96%;
        height: 50px;
        margin: -30px auto 0;
        z-index: -5000;
    }
    #starArea #starL{
        position: absolute;
        top: 0;
    }
    #starArea #starR{
        position: absolute;
        top: 0;
    }
    #starArea img{
        width: 61px;
    }
	#seido > h2,
	#faq > h2{
		font-size:120%;
		margin-bottom:20px;
	}

    /* フォトギャラリー */
    #seidoAndFaq{
        padding: 15px 0 35px;
        background: #d4f0fa;
    }
    .shadow_show_wrap {
        position: relative;
        height: 115px;
        margin-bottom: 10px;
        text-align: center;
        background: url('../../img/icon_shadow.jpg') center bottom no-repeat;
        overflow: hidden;
    }
    .shadow_show_item{
        position: absolute;
        top: 10px;
        left: 0;
        width: 100%;
        height: 80px;
    }
    .action .shadow_show_item{
        top: 15px;
    }
    .shadow_show_item img{
        height: 80px;
    }
    #seido{
        margin-bottom: 35px;
    }

    /* フォトギャラリー */
    #gallery{
        padding: 26px 0 0;
    }
    #gallery h2{
        width: 170px;
        height: 25px;
        margin: 0 auto 10px;
    }
    #gallery .h2_ja{
        width: 163px;
    }
    #galleryLeft{
        position: relative;
        width: 320px;
        height: 241px;
        margin: 0 auto;
    }
    #galleryLeft #woman{
        position: absolute;
        bottom: 0;
        left: 13px;
        z-index: 200;
    }
    #galleryLeft #woman img{
        width: 160px;
    }
    #galleryLeft #photo{
        position: relative;
        top: 0;
        right: 13px;
    }
    #galleryLeft #imgPhotoBG{
        position: absolute;
        top: 0;
        right: 0;
    }
    #galleryLeft #imgPhoto{
        position: absolute;
        top: 10px;
        right: 4px;
    }
    #photoSlider{
        padding: 20px;
        border-top: 2px solid #84d5f2;
        background: url('../../img/photo_more_bg.gif');
    }
    #photoSlider .bx-wrapper{
        display: none;
    }

}
