@charset "UTF-8";

/* ++++++++++++++　　　対応可能な実務（business.php）　　　++++++++++++++++++*/


/*******************************************************
　　2022 0624更新
*******************************************************/






/* ////////////////////////////////////////////////////////////////////////////////////////

　　　　　全てのスクリーンサイズで適用される設定・モバイルファースト
　　　　　
//////////////////////////////////////////////////////////////////////////////////////// */

/*******************************************************
　　実行可能な実務　リンク
*******************************************************/


.link-waku{
    width: 100%; 
    max-width: 1040px;
	margin-left: auto;
	margin-right: auto;
	padding:0 10px;
	margin-top:50px;
    margin-bottom: 50px;
}



.link-lead{
    margin-bottom: 20px;
    margin-left: 20px;
    margin-right: 20px;    
}


.link-photo{
    width: 50%;
    height: 100px;
    margin-left: auto;
	margin-right: auto;
    background: url("../images_2022/000_01_02.png") no-repeat;
    background-size: 100px;
    margin-bottom: 10px;
}



.link-lead p{
    font-size: 16px;
    line-height: 140%;
}




/*ｆlex指定*/
.bussiness-ul{
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
}




/*ｆlex指定*/
.bussiness-ul li{
    margin: 0 10px 10px 10px;
    
}



.bussiness-ul li{
    width: 292px;
    height: 70px;
    border: solid 1px #234c88;
    background: url("../images_2022/000_arw_mini2.png") no-repeat right 10px top 55px;
    background-size: 6px;
}


.bussiness-ul li.blank-link{
    border: none;
    background: none;
    height: 10px;
}




.bus-a{
   
}

.bussiness-ul li:hover{
   filter: brightness(105%);
}




.bus-no-waku{
    float: left;
    display: table;
    width: 40px;
    height: 70px;
}


.bus-no{
    display: table-cell;
    font-size: 30px;
    font-weight: bold;
    line-height: 100%;
    color: #234c88;
    text-align: center;
    vertical-align: middle;
    
}



.back-stripe-green{
    background: repeating-linear-gradient(-45deg, #f3fbfa 0, #f3fbfa 2px, #caede7 2px, #caede7 6px);
}

.back-stripe-sky{
    background: repeating-linear-gradient(-45deg, #f7fcff 0, #f7fcff 2px, #d9efff 2px, #d9efff 6px);
}


.bus-text-waku{
    float: left;
    display: table;
    width: 226px;
    height: 70px;
    
}

.bus-text{  
    display: table-cell;
    vertical-align: middle;
    font-size: 14px;
    line-height: 140%;
    font-weight: bold;
    color: #0a1d42;
    padding: 0 10px;
}





/*******************************************************
　No1〜No11 実務内容　基本共通指定
*******************************************************/
.bus-con-waku{
   width: 100%;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 50px;
    padding-bottom: 40px;
}

/*タイトル*/
.business-title-waku{
    border: solid 1px #ccc;
    margin-bottom: 10px;
}


.business-title-L{
    display: table;
    width: 40px;
    height: 60px;
    float: left;
}

.business-title-no{
    display: table-cell;
    font-size: 28px;
    font-weight: bold;
    line-height: 100%;
    color: #234c88;
    text-align: center;
    vertical-align: middle;
    height: 60px;
    
}


.business-title-R{
    display: table;
    width: 240px;
    float: left;
    height: 60px;
}

.business-title-text{
    display: table-cell;
    padding-left: 10px;
    font-size: 15px;
    font-weight: bold;
    line-height: 120%;
    vertical-align: middle;
    color: #333;   
}








/*　タイトル下　顔写真左テキスト*/
.bus-stitle-waku{
    width: 100%;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    border-bottom: dotted 1px #ccc;
    padding-bottom: 10px;
    margin-bottom: 25px;
}

.m-photo{
    float: left;
    width: 75px;
    margin-left: 5px;
}

.m-photo img{
    width: 60px;
    border-radius: 50%;
    border: solid 1px #ccc;
}

.stitle-waku{
    float: left;
    width: calc(100% - 85px);
    display: table;
    height: 60px;
    
}

.stitle{
    display: table-cell;
    vertical-align: middle;
}

.stitle p{
    font-size: 18px;
    line-height: 140%;
    color: #000;
}




/*内容テキスト&画像*/
.bus-con-block{
    
}








/***********************************
　No1 　No2 　No8
************************************/

.con-3block{
    width: 100%;
    max-width: 1000px;
    margin: 0 auto 0 auto;
    display: flex;
    flex-flow:row wrap;
    justify-content: center;
}


.con-3block-li{
    position: relative;
    width: 313px;
    border: solid 1px #ccc;
    margin: 0 7px 14px 7px;
    
    
}


/*liの高さ指定（No1）*/
.con01-li{
    /*1000px以上で 高さ指定*/
}

.con01-li:last-child{
    height: 360px;
}




/*liの高さ指定（No2）*/
.con02-li{
    height: 275px;/*後で調整*/
}

/*liの高さ指定（No7）*/
.con07-li{
    height: 380px;/*後で調整*/
}







/*タイトル部分*/
.con-block-title-waku{
    
}


/*No1 No2 タイトル部分 バックカラー（No1 水色）*/
.con01-back-sky{
    background-color: #f6fbff;
    border-bottom: solid 2px #3366b0;  
}

/*No7 タイトル部分 バックカラー（No7 エメラルドグリーン）*/
.con01-back-egreen{
    background-color: #eaf8f6;
    border-bottom: solid 2px #00a99d;  
}



/*タイトルテキスト*/
.con-block-title{
    font-size: 18px;
    font-weight: bold;
    line-height: 100%;
    padding: 8px 0 8px 28px;
    
}


/*No1 No2 配置する 円カラー*/
.en01{
    background: url("../images_2022/cmn_en1.png") no-repeat 5px 7px;
    background-size:20px;  
}


/*No7 配置する 円カラー*/
.en03{
    background: url("../images_2022/cmn_en3.png") no-repeat 5px 7px;
    background-size:20px;  
}


/*No1 Noカラー*/
.c-blue1{
    color: #3366b0;
}





/*No1 No2 タイトル下、コンテンツ部分 指定*/
.con-block-in1{
   padding: 10px;
}



/*No1コンテンツ テキスト指定*/
.con-text1{
    font-size: 16px;
    line-height: 150%;  
}


.block-in-ul{
    
}

.block-in-ul li{
    font-size: 14px;
    line-height: 120%;
    margin-bottom: 8px;
}

/*No1 写真*/
.n1-2img{
    width: 100%;
    max-width: 290px;
    margin: 20px auto 0 auto;
}

.n1-3img{
    width: 100%;
    max-width: 290px;
    position: absolute;
    bottom: 0px;
    left:10px;
}


/*No2 写真*/
.n2-1img{
    width: 100%;
    max-width: 285px;
    position: absolute;
    bottom: 12px;
    left:13px;
}






/*No7　テキスト*/
.consulting-text{
    font-size: 16px;
    line-height: 140%;
    text-align: center;
    padding: 20px 0 10px 0;
}

/*No7　図*/
.consulting-img{
    display: block;
    width: 100%;
    max-width:225px;
    margin: 0 auto;    
}

/***********************************
　No3
************************************/
.con-2block{
    width: 100%;
    max-width: 1000px;
    margin: 0 auto 0 auto;
    display: flex;
    flex-flow:row wrap;
    justify-content: center;
}


.con-2block-li{
    width: 95%;
    max-width:420px; 
    border: solid 1px #ccc;
    margin: 0 7px 14px 7px;
    
    
}

/*liの高さ指定（No3）*/
.con03-li{
    height: 180px;/*後で調整*/
}



.con-lead1{
    font-size: 16px;
    line-height: 160%;
    text-align: center;
    padding:0 10px 0 10px;
}


.con-lead3title{
    width: 260px;
    margin: 0 auto 15px auto;
    padding: 10px 10px 10px 10px;
    font-size: 20px;
    font-weight: bold;
    line-height: 120%;
    text-align: center;
    color: #fff;
    border-radius: 30px;
    background-color: #006c88;
}


.con-block-in_no3{
    
    
}

.no3_L{
    width: 100px;
    margin-left: 10px;
    margin-right: 10px;
    float: left;
}


.no3_L img{
    width: 100%;
}



.no3_R{
    width: calc(100% - 125px);
    float: left;
    margin-top: 10px;
}


/***********************************
　No4
************************************/


.con-lead4{
    /*font-size: 16px;*/
    font-size: 20px;
    line-height: 160%;
    padding:0 10px 25px 10px;
}



.con-4block{
    width: 100%;
    max-width: 1000px;
    margin: 0 auto 0 auto;
    display: flex;
    flex-flow:row wrap;
    justify-content: center;
}


.con-4block-li{
    position: relative;
    width: 225px;
    border: solid 1px #ccc;
    margin: 0 10px 20px 10px;
    
    
}

.con04-li{
    height: 350px;/*後で調整*/
}


.con-block-title4{
    font-size: 18px;
    font-weight: bold;
    line-height: 120%;
    padding: 8px 0 8px 32px;
    text-indent:-26px;
    
}



.con-4-img{
    width: 205px;
    position: absolute;
    bottom: 10px;
    
}

.right-arw{
    display: block;
    position:absolute;
    right:-14px;
    top: 14px;
    
}












/***********************************
No5 No7 No11
************************************/


/*左右分割*/
.bus-con-block-L{
    width: 95%;
    max-width: 450px;
    margin-left: auto;
    margin-right: auto;
}

.bus-con-block-R{
    width: 95%;
    max-width: 445px; 
    margin-left: auto;
    margin-right: auto;
}


.bus-con-block-R img{
    width: 100%;
}


.border-gry{
   border: solid 1px #ccc;
}



/*左　テキスト部分*/
.con-1block{
    
}

.con-1block-l{
    font-size: 18px;
    line-height: 140%;
    font-weight: bold;
    padding: 1px 0 5px 24px;
}







/*No4 No5 配置する 円カラー*/
.en03-2{
    background: url("../images_2022/cmn_en3.png") no-repeat 0px 3px;
    background-size:20px;  
}

/*No11 配置する 円カラー*/
.en01-2{
    background: url("../images_2022/cmn_en1.png") no-repeat 0px 3px;
    background-size:20px;   
}


/*No4　オプションタイトル*/
.optin-tittle{
    font-size: 18px;
    font-weight: bold;
    line-height: 100%;
    color: #fff;
    padding: 5px;
    width: 200px;
    background-color: #00a99d;
    border-radius: 0 20px 20px 0;
    margin-bottom: 10px;
}



/*No4　リスト内リスト*/
.con-1block-in{

}

.con-1block-in-li{
     font-size: 16px;
    line-height: 160%;
    font-weight: normal;
}



/*No5左テキスト*/
.con-text2{
   font-size: 16px;
   line-height: 160%;   
}





/***********************************
　No6
************************************/

.m-left10{
    margin-left: 10px;
}


/*ｆlex指定*/
.bus-con-block2{
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
}

/*ｆlex指定*/
.bus-con-block2-in{
     margin: 10px 15px 10px 15px;
}

.bus-con-block2-in{
    width: 90%;
    max-width: 450px;
}



.sampe-title{
    font-size: 20px;
    font-weight: bold;
    line-height: 100%;
    color: #00a99d;
    width: 280px;
    border: solid 1px #00a99d;
    border-radius: 30px;
    text-align: center;
    padding: 10px 0 10px 0;
    margin: 0 auto 20px auto;
    
}

.sample-block{
    width: 99%;
    /*border: solid 1px #ccc;*/
}

.sample-block img{
    display: block;
    width: 100%;
    margin:10px auto 10px auto;
}



/***********************************
　No8
************************************/
.network-lead2{
    font-size: 16px;
    line-height: 140%;
    font-weight: bold;
    text-align: center;
    color: #333;
    padding: 0 10px 30px 10px;
}


.network-lead2 span{
    font-size: 20px;
}

.network-img{
    display: block;
    width: 95%;
    max-width: 650px;
    margin: 0 auto 0 auto; 
}



/***********************************
　No9
************************************/


.bus-con-block3{
    width: 90%;
    max-width:700px;
    margin-left:auto;
    margin-right: auto; 
}


.en-title{
    font-size: 20px;
    line-height: 140%;
    font-weight: bold;
    padding: 1px 0 5px 24px;
     background: url("../images_2022/cmn_en1.png") no-repeat 0px 5px;
    background-size:20px; 
    margin-bottom: 5px;
}



.shyohyo-price{
    width: 100%;
}



.shyohyo-price th,
.shyohyo-price td{
    border: solid 1px #ccc;
}




.shyohyo-price th{
    width: 120px;
    text-align: center;
    vertical-align: top;
    font-size: 18px;
    background-color: #f6fbff;
    color: #222;
    padding: 10px 0 10px 0;
}

.shyohyo-price td{
    padding: 10px 10px 10px 20px;
    font-size: 18px;
    line-height: 200%;
    font-weight: bold;
    
}


.shyohyo-price td em{
    color: #3366b0;
    font-size: 30px;
}







/* ////////////////////////////////////////////////////////////////////////////////////////

　　　　　スクリーンサイズ 幅 480px 以上で適用される設定・上から継承したスタイルを上書き
　　　　　
//////////////////////////////////////////////////////////////////////////////////////// */

@media only screen and (min-width: 480px) {
    
/*******************************************************
　　実行可能な実務　リンク
*******************************************************/

.link-waku{
    margin-top:80px;
}

 
    
    
    
.link-photo{
    width: 30%;
    height: 100px;
    margin-left: 0;
	margin-right: 0;
    background: url("../images_2022/000_01_02.png") no-repeat right 30px top 0px;
    background-size: 100px;
    margin-bottom: 0px;
    float: left;
}



.link-lead p{
    font-size: 16px;
    line-height: 140%;
    width: 65%;
    float: left;
    margin-top: 10px;
}    
    
 
/*******************************************************
　No1〜No9 実務内容　基本共通指定
*******************************************************/ 
    
/*タイトル*/
.business-title-waku{
    border: solid 1px #ccc;
    margin-bottom: 15px;
}  
    
    
    
 .business-title-R{
    width: 440px;
}   
    
    
.business-cont-L{
    margin-left: 10px;
    margin-right: 0;
    width: 69%;
    float: left;
}


.business-title-text{
    font-size: 18px;
}    
    
    
 
    

/***********************************
　No4 No5 No6
************************************/


/*左右分割*/
.bus-con-block-L{
    float: left;
    width: 45%;
    max-width: 450px;
    margin-left: 15px;
    margin-right: 0;
}

.bus-con-block-R{
    float: right;
    width: 45%;
    max-width: 445px; 
    margin-left: 0;
    margin-right: 15px;
}

    
    
    
    


}



/* ////////////////////////////////////////////////////////////////////////////////////////

　　　　　スクリーンサイズ 幅 650px 以上で適用される設定・上から継承したスタイルを上書き
　　　　　
//////////////////////////////////////////////////////////////////////////////////////// */

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

    
/*******************************************************
　No1〜No9 実務内容　基本共通指定
*******************************************************/ 
    

    
 .business-title-R{
    width: 610px;
}   
    
    
    
    
    
    
}







/* ////////////////////////////////////////////////////////////////////////////////////////

　　　　　スクリーンサイズ 幅 760px 以上で適用される設定・上から継承したスタイルを上書き
　　　　　
//////////////////////////////////////////////////////////////////////////////////////// */

@media only screen and (min-width: 760px) {
/*******************************************************
　　実行可能な実務　リンク
*******************************************************/

.link-waku{
    margin-top:100px;
}



.link-lead{
    margin-bottom: 0px;
    margin-left: 20px;
    margin-right: 20px;    
}       
    
 
.link-lead p{
    font-size: 18px;
    margin-top: 10px;
}    
       
   
    
/*******************************************************
　No1〜No9 実務内容　基本共通指定
*******************************************************/  
    

    
    
    
    
    
	
}


/* ////////////////////////////////////////////////////////////////////////////////////////

　　　　　スクリーンサイズ 幅 1000px 以上で適用される設定・上から継承したスタイルを上書き
　　　　　
//////////////////////////////////////////////////////////////////////////////////////// */

@media only screen and (min-width: 1000px) {
/*******************************************************
　　実行可能な実務　リンク
*******************************************************/

.link-waku{
    margin-top:140px;
}
	

    
.link-photo{
    width: 195px;
}



.link-lead p{
    width: 700px;
    margin-top: 20px;
}    
       
    
    
/*******************************************************
　No1〜No9 実務内容　基本共通指定
*******************************************************/     

    
    /*liの高さ指定（No1）*/
    .con01-li{
    height: 480px;/*後で調整*/
    }

    .con01-li:last-child{
    height: 480px;
}

    
    
    
	
}
