@charset "UTF-8";

/* ++++++++++++++　　　知財戦略チームの活用方法について（team-use.php）　　　++++++++++++++++++*/


/*******************************************************
　　●●●
*******************************************************/

/*=============== ●●● ===============*/

/*********************************
●●● 
*********************************/

/*******************************************************
   共通指定
*******************************************************/





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

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


/*　max-width: 1000pxの内枠　*/
section.step-waku{
	max-width: 980px;
	margin-left: auto;
	margin-right: auto;
	padding:0 10px;
	margin-top:30px;
    margin-bottom: 50px;
}








/*　STEPタイトル　*/
.step-title{
    width: 90%;
    max-width: 443px;
    margin-left: auto;
	margin-right: auto;
    margin-bottom: 20px;
}


.step-title img{
    width: 100%;
    max-width: 443px;
}


/*　STEPリード　*/
.step-lead{
    font-size: 18px;
    line-height: 140%;
    font-weight: bold;
    text-align: center;
    color: #0a1d42;
    margin-bottom: 40px;
}

/*　STEP　テキスト画像部分　*/
.step-block{
    max-width: 980px;
	margin-left: auto;
	margin-right: auto;
	padding:0 10px;
}



.step-block-L{
    margin-bottom: 20px;
    
}


.step-block-R{
    
}

.step-text{
    font-size: 16px;
    line-height: 160%;
}

.step-text em{
    font-weight: bold;
    color: #000;
    background:linear-gradient(transparent 70%, #fbe967 70%);    
}


.step1-img{
    width: 100%;
    max-width: 400px;       
}    
    

.step2-img{
    width: 100%;
    max-width: 442px;       
}    
    



/*********************************
こんな企業様
*********************************/
.p-team-use-waku{
    background-color: #57a8c8;
    width: 100%;
    padding-top: 40px;
    padding-bottom: 40px;
}


.p-team-use{
    width: 100%;
    max-width: 1040px;
    margin-left: auto;
    margin-right: auto;
}

.p-team-use-text1 img{
    display: block;
    width: 95%;
    max-width: 336px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
}


/*flexbox指定*/
.p-team-use-ul{
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    flex: 1 0 20%;
}

.p-team-use-ul li{
    margin: 0 10px 20px 10px;
    
}



/*バックグラウンド背景指定*/
.p-team-use-ul li{
	max-width:320px;/* 　適宜　max-width指定 */
	border:solid 2px #ccc;/* 　適宜　枠の指定 */
	border-radius: 10px;
	position:relative;/*　中に入れ子にするinner要素の指定のためpositionを指定　*/
	width:100%;/*　横幅の可変を可能にするため、％指定する　*/
	height:auto;/*　auto指定　実際の高さは、:beforeのpadding-topで指定する　*/
}


.p-team-use-ul li.p-team-use_li01{
    background:url(../images_2022/000_03_01.png) no-repeat;/*　バックグラウンドに指定する画像を配置　*/
	background-size:contain;/*　バックグラウンドに指定する画像を、縦横比を変えないで、伸縮させる　*/	 
}

.p-team-use-ul li.p-team-use_li02{
    background:url(../images_2022/000_03_02.png) no-repeat;/*　バックグラウンドに指定する画像を配置　*/
	background-size:contain;/*　バックグラウンドに指定する画像を、縦横比を変えないで、伸縮させる　*/	 
}

.p-team-use-ul li.p-team-use_li03{
    background:url(../images_2022/000_03_03.png) no-repeat;/*　バックグラウンドに指定する画像を配置　*/
	background-size:contain;/*　バックグラウンドに指定する画像を、縦横比を変えないで、伸縮させる　*/	 
}




/* before指定 */
/* 横：高さの比率を paddingで指定し、高さを指定する */
/*　　例　幅1000px　高さ665pxの画像を入れる場合　　*/
.p-team-use-ul li:before{
	content:"";
	display:block;
	padding-top:94.4%;/*H302px/W320px　*/
	
}



.p-team-use-text2{
    font-size: 18px;
    font-weight: bold;
    line-height: 140%;
    color: #fff;
    text-align: center;
    padding:10px 10px 20px 10px;
}





/*ボタン位置指定　センター*/
.btn01-waku2,
.btn02-waku2{
    width: 95%;
    max-width: 382px; 
    margin-left: auto;
    margin-right: auto;
}

.btn01-waku2{
    margin-bottom: 10px;
}




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

.lead-text1{
    font-size: 17px;
    font-weight: bold;
    line-height: 140%;
    color: #0a1d42;
    text-align: center;
    padding: 0 5px;
}



.bussiness-waku{
    width: 100%; 
    padding-bottom: 50px;
}


.bussiness{
    width: 100%;
    max-width: 1040px;
    margin-left: auto;
    margin-right: auto;
}


/*ｆ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: 316px;
    height: 100px;
    border: solid 1px #234c88;
    background: url("../images_2022/000_arw_mini1.png") no-repeat right 10px top 75px;
    background-size: 6px;
}

.bus-a{
   
}

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




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


.bus-no{
    display: table-cell;
    font-size: 48px;
    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: 250px;
    height: 100px;
    
}

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












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

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

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

/*　max-width: 1000pxの内枠　*/
section.step-waku{
	margin-top:80px;
}    
    
    

 /*　STEP　テキスト画像部分　*/   
.step-block-L{
    margin-bottom: 0px;
    width: 50%;
    max-width: 442px;
    float: left;
}


.step-block-R{
    width: 45%; 
    max-width: 470px;
    float: right;
    
}

    



}
/* ////////////////////////////////////////////////////////////////////////////////////////

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

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

/*　max-width: 1000pxの内枠　*/
section.step-waku{
	margin-top:100px;
}    
    
   
    
/*　STEPリード　*/
.step-lead{
    font-size: 24px;/*文字サイズ変更*/
    line-height: 140%;
    font-weight: bold;
    text-align: center;
    color: #0a1d42;    
    }
    
   
 .step-text{
    font-size: 18px;
    line-height: 180%;
}    
       
    
    
    
/*********************************
こんな企業様
*********************************/  
    
  .p-team-use-text2{
    font-size: 20px;/*サイズ変更*/
}       
    
    
    
    
    

	
}


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

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

@media only screen and (min-width: 1000px) {
	
/*　max-width: 1000pxの内枠　*/
section.step-waku{
	margin-top:140px;
}
    
    
	
}
