
/*common.css*/

.style2 {text-align: center;}

h1{
    font-size: 1.1em;
}

#F0,#F0_2-5{/*大枠*/
    max-width: 940px;
    width: 100%;
    height: auto;
    margin: 0 auto;
    border: solid 2px #408080;
    background-color: #feffff;
}

#F0{
    height: auto
}
#F1{
    max-width: 820px;
    width: 100%;
    margin: 0 auto
}
#F1 h3{
    font-size:1.6rem
}
/*〓メニューから案内矢印【サイズと色】*/
#yajirusi{
    max-width: 940px;
    width: 100%;
    height:120px;
    margin: 0 auto;
    margin-top: -55px;
}

#ya-00,#ya-11,#ya-22,#ya-33{
    display: none
}
#ya-00{/*メニュー下のバー*/
    width: 180px;
    height:2px;
}
#ya-11{/*矢印縦棒*/
    width: 10px;
    height:20px;
}
#ya-22{/*矢印横棒*/
    width:382px;
    height:7px;
}
#ya-22 span{/*矢印ページ数*/
    padding: 0 10px;
    background-color:  #157760 ;
    color: #fff;
}
#ya-33{/*下の矢印縦棒*/
    width:7px;
    height:22px;
}
#ya-33:after{/*矢印*/
    content: "\f063";
    font-family: FontAwesome;
    color: #157760;
    font-size: 2.2rem;
    position: relative;
    top: 6px;
    left: -7px
}

#F0{/*大枠*/
    min-height:900px;
    height: auto;
    margin-top: -30px;
    padding-top: 20px
}

/*〓各ページのh3タイトルエリア------------*/
.title-area{
    width:300px;
    height:36px;
    margin: 0 auto;
    background-color: #157760;
    margin-top: 10px;
}
.title-area a{/*タイトル*/
    color: #fff000;
    line-height: 2.5em;
    text-align: center;
    display: block
}
.title-area a:hover{/*タイトル*/
    background-color:#157760; 
    color: #FFF;
}
/*〓ページの外枠*/
.page-img,
.page-img-map{/*ページ画像枠*/
    margin-top: 0px;
    width: 300px;
    height:396px;
    margin: 0 auto;
    padding: 0px;
    text-align: center;
    background-color:#eee
}
.page-img img{/*ページ画像枠*/
    margin-top: 10px;
    width: 268px;
    height:365px;
}
/*〓下向き矢印*/
.inner3:after{/*下矢印*/
    content: "\f063";
    font-family: FontAwesome;
    color:#157760; 
    font-size: 2rem;
    margin-left: 36px;
    position: relative;
    top:-404px
}
/*〓各ページのh3タイトルホバーで画像枠色変え*/
.title-area:hover + .page-img3,
.title-area:hover + .page-img,
.title-area:hover + .page-img-map,
.title-area:hover + .page-nai-link-img
{
    background-color: #157760;
    -webkit-transition: 0.3s;
    transition: 0.3s;
}
/*〓各ページの画像ホバーで枠色変え*/
.page-img3:hover,
.page-img:hover,
.page-nai-link-img:hover,
.page-img-map:hover{/*ページ画像枠*/
background-color:  #157760;
    -webkit-transition: 1s;
    transition: 1s;
}

/*〓下層ページリンクエリアボーダー*/
#menu-up-l,
#menu-up-r,
#menu-center-l,
#menu-center-r,
#menu-under-l,
#menu-under-r{/*メニュー*/
    width: 340px;
    height: auto;
    border: solid 2px #008080;
    margin: 0 auto;
}
#menu-up-l
/*右上*/{
height: 630px;
    margin-bottom: 20px
}
#menu-center-r{
    margin-bottom: 20px
}
#menu-under-r{
    margin-bottom: 30px
}
/*〓下層ページボタン*/
#menu-up-l li a,
#menu-up-r li a,
#menu-center-l li a,
#menu-center-r li a,
#menu-under-l li a,
#menu-under-r li a{/*メニュー*/
    color: #fff;
    display: block;
    background-color:#157760;
    font-size: 1.4rem;
    padding-left: 3px;
}

#menu-up-l li a:hover,
#menu-up-r li a:hover,
#menu-center-l li a:hover,
#menu-center-r li a:hover,
#menu-under-l li a:hover,
#menu-under-r li a:hover{/*メニュー*/
    color: #0ee50e;
    background-color:#157760;
}
.ul-1 li,.ul-2 li,.ul-3 li,.ul-4 li,.ul-5 li,.ul-6 li{
 -webkit-box-shadow: 1px 1px 1px #000;
 box-shadow: 1px 1px 1px #000;
    margin: 10px 0
}

/*━━━━━━━━━━━━━━━━━━━━━━━━━上━up━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/

/*==============〓BOX・上-左〓======================*/
/*〓会社を作るために考えるべきこと〓*/
/*〓下層ページリンクエリア------*/
#menu-up-l{
/*    height: 482px;*/
    padding-top:32px;
    margin-top:20px;
}
#ul-up-l{/*メニュー*/
    position: relative;
    top:-402px;
}
#ul-up-l span{
    font-size: .67rem;
    margin-left:3px;
}
#menu-up-l ul{
    margin-top: 5px;
    padding-left: 10px
}
/*〓下層ページリンクエリア内タイトル------*/
#menu-up-l ul li:nth-child(1),
#menu-up-l ul li:nth-child(5),
#menu-up-l ul li:nth-child(12),
#menu-up-l ul li:nth-child(17),
#menu-up-l ul li:nth-child(19){
    background-color:#D7F5EE;
    line-height: 0.6em;
    font-size: 0.8rem;
    margin-top: 6px;
    margin-left: 0;
    margin-bottom: .page-info
    -webkit-box-shadow:0 0;
    box-shadow:0 0;
}

#menu-up-l ul li{
    line-height: 0.85em;
    width:310px; 
    padding:1px 0;
    background-color: #157760;
    margin-left: 3px;
/*    margin-bottom: 2px*/
}
#menu-up-l ul li a{
    padding: 4px;
}
/*サイドメニュー点線枠サイズと位置*/
#inner-up-l{
    width: 78px;/*ページ画像サイドメニュー枠*/
    height:348px;
    position: relative;
    top:-410px;
    left:30px
}
/*==============〓BOX・上-右〓=====================*/
/*〓会社設立の方法〓*/
/*〓ダウンロードボタンエリア------*/
#menu-up-r{
    height: 400px;
    padding-top:10px;
    margin-top: 6px;
}
#menu-up-r ul li{
    width: 300px;
    height: 160px;
    margin-top: 20px;
    -webkit-box-shadow:0 0;
    box-shadow:0 0;
}
#menu-up-r ul li a{
    position: relative;
    top:20px;
    left:14px;
    padding: 5px;
    -webkit-box-shadow: 1px 1px 1px #000;
    box-shadow: 1px 1px 1px #000
}

#up-r-ya4{/*矢印*/
    position:relative;
    top:23px
}
.ul-up-r{/*メニュー*/
    position: relative;
    top:-350px;
}
.ul-up-r li{/*メニューli*/
    line-height: 1.4em
}
.d-link{
    width: 300px;
    height: 20px;
    margin-top: -20px;
}
.page-img2{
    margin-top: 18px;
    text-align: center
}


/*━━━━━━━━━━━━━━━━━━━━━━━中━center━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/

/*==============〓BOX・中-左〓=====================*/
#menu-center-l{/*メニュー枠*/
    margin-top: 20px;
    height: 140px;
    padding: 10px;
}
#inner-center-l{
    width: 254px;/*ページ画像サイドメニュー枠*/
    height: 35px;
    position: relative;
    top:-114px;
    left: 30px
}
#inner-center-l-2{
    width: 254px;/*ページ画像サイドメニュー枠*/
    height: 200px;
    position: relative;
    top:-114px;
    left: -2px
}
#menu-center-l li{/*メニュー*/
    margin-bottom: 14px;
    background-color: #157760;
    padding: 2px 2px;
    position: relative;
    top:-35px
}

/*==============〓BOX・中-右〓=====================*/
#menu-center-r{/*メニュー枠*/
    margin-top: 20px;
    height: 200px;
    padding: 10px; 
}
#inner-center-r{
    display: none;
}
#menu-center-r li{/*メニュー*/
    margin-bottom: 14px;
    background-color: #157760;
    padding: 2px 2px
}


/*━━━━━━━━━━━━━━━━━━━━━下━under━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/

/*==============〓BOX・下-左〓=====================*/
#menu-under-l{/*メニュー枠*/
    margin-top: 20px;
    height: 228px;
    padding: 10px;
}
#inner-under-l{
    width: 74px;/*ページ画像サイドメニュー枠*/
    height: 270px;
    position: relative;
    top:-410px;
    left: 21px;
}

#menu-under-l li{/*メニュー*/
    position: relative;
    top:-275px;
    margin-bottom: 4px;
    background-color: #157760;
    padding: 2px 2px;
}


/*==============BOX・下-右〓=====================*/
#menu-under-r{/*メニュー枠*/
    margin-top: 20px;
    height: auto;
    padding: 10px;
    margin-bottom: 20px
}
#up-r-ya3-baa{
    width: 10px;
    height: 100px;
    background-color: #157760;
}
#inner-under-r{
    width: 74px;/*ページ画像サイドメニュー枠*/
    height: 270px;
    position: relative;
    top:-404px;
    left: 22px
}
#inner-index4{
    width: 74px;/*ページ画像サイドメニュー枠*/
    height: 190px;
    position: relative;
    top:-386px;
    left: -100px
}
#menu-under-r li{/*メニュー*/
    position: relative;
    top:-276px;
    margin-bottom: 4px;
    background-color: #157760;
    padding: 2px 2px;
}

.page-img-map{
    width: 280px;
    height: 220px;
    margin: 0 auto
}
.page-img-map img{
    width: 268px;
    height: 196px;
    text-align: center;
}

#I{background-color: #408080;
    padding: 10px;
}

p{
    margin: 0;
}

/*下層ページリンク枠背景ホバー*/
.menu-li:hover{
    background-color: rgba(0, 128, 0, 0.3);
    -webkit-transition: .3s;
    transition: .3s;
}


.flex-box{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-orient:vertical;
	-webkit-box-direction:normal;
	-ms-flex-direction:column;
	flex-direction:column;/*縦*/
}
.flex-box .box,
.flex-box .box1,
.flex-box .box2,
.flex-box .box3,
.flex-box .box4,
.flex-box .box5,
.flex-box .box6{
        margin: 0 auto;
    }
/*〓各ブロックエリア--------------*/
.box,.box2,.box3,.box4,.box5,.box6{
    max-width: 400px;
	width: 100%;
    height: auto;
    background-color: #f1feff;
}
/*プロックページタイトル*/
.box h3,.box2 h3,.box3 h3,.box4 h3{
	width:300px;
	height:26px;
    font-size: 1rem;
}


@media screen and (min-width:860px) {
    .flex-box{
        margin-bottom: 10px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row
    }
#ya-00,#ya-11,#ya-22,#ya-33{
    background-color:#157760;
    margin: 0 auto;
    display: block
}
}
