@charset "utf-8";

/*基本色*/
:root{
    --main-color: #E6BEAA; /*FFDAC7*/
    --accent-color: #A50021;
    --dark-main-color: #6E3546;
    --text-bright-color:#FFF;
    
}
/*基本設定：ページ全体*/
body{
    margin:0;
    font-family: 'メイリオ','Hiragino Kaku Gothic Pro',sans-serif;
    color: #262626;
}
bold{
    font-weight: bold;
}
/********************************************
    共通のルール
*********************************************/
/*横幅1000px内に調整する*/
.container-basic{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
/*数字を使ったアイコン*/
.icon-title{
    display: flex;
    align-items: flex-end;
}
/*数字アイコンのプロパティ*/
.icon{
    font-size: 20px;
    font-weight: bold;
    display: inline-block;
    margin-right: 10px;
    width: 2em;
    line-height: 2em;
    border-radius: 50%;
    text-align: center;
    background-color: #404040;
    color: white;
}
/*タイトル表示 見出し*/
.title h1{
    padding-left: 0.5rem;
    border-left: solid 0.75rem #6E3546;
    font-size: 1.5rem;
    margin-top: 20px;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;  
}
/*背景が写真のお問い合わせボタン*/
.button-photo{
  	display: inline-block;
	margin: 20px;
	padding: 30px 60px;
	border: solid 3px white; /*輪郭線の色を変える*/
	border-radius: 6px;
    background-image: url(../images/contact_btn.jpg);
    background-position: center;
    background-size: cover;
    color:#262626;
	font-size: 18px;
    font-weight: bold;
	text-decoration: none;  
}
.button-photo:hover	{
	opacity: 0.8;
}

/*ブログボタン*/
.blog-button-photo{
  	display: inline-block;
	margin: 0px;
	padding: 60px 50px;
	border: solid 3px white; /*輪郭線の色を変える*/
	border-radius: 6px;
    background-image: url(../images/blog.png);
    background-position: center;
    background-size: contain;
    color:#404040;
	font-size: 16px;
    font-weight: bold;
	text-decoration: none;  
}
.blog-button-photo:hover	{
	opacity: 0.8;
}



/*資料請求用お問い合わせボタン*/
.button-A{
  	display: inline-block;
	margin: 10px;
	padding: 20px 100px 20px 10px;
	border: solid 3px white; /*輪郭線の色を変える*/
	border-radius: 6px;
    background-color: #6E3546;
    /*background-image: url(../images/icon-mail2.svg);*/
    background-position: right;
    background-size: contain;
    color:white;
	font-size: 18px;
    font-weight: bold;
	text-decoration: none;  
}
.button-A:hover	{
	opacity: 0.8;
}
/*個人用お問い合わせボタンred*/
.button-B{
  	display: inline-block;
	margin: 10px;
	padding: 10px 100px 10px 10px;
	border: solid 3px white; /*輪郭線の色を変える*/
	border-radius: 6px;
    background-color: #4D4D4D;
    /*background-image: url(../images/icon-heart2.svg);*/
    background-position: right;
    background-size: contain;
    color:white;
	font-size: 18px;
    font-weight: bold;
	text-decoration: none;  
}
.button-B:hover	{
	opacity: 0.8;
}
/*個人用お問い合わせボタンLINE*/
.button-B2{
  	display: inline-block;
	margin: 10px;
	padding: 10px 100px 10px 10px;
	border: solid 3px white; /*輪郭線の色を変える*/
	border-radius: 6px;
    background-color: #00CC00;
    /*background-image: url(../images/icon-heart2.svg);*/
    background-position: right;
    background-size: contain;
    color:white;
	font-size: 18px;
    font-weight: bold;
	text-decoration: none;  
}
.button-B:hover	{
	opacity: 0.8;
}
/*トップイメージTop*/
.image-A{
    display: flex;
    align-items: center;
    justify-content: center;
	height: 20vh;
	min-height: 300px;
    background-image: linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.3));
    background-position: top;
    background-size: cover;
    text-align: center;
}
/*トップイメージCenter*/
.image-A2{
    display: flex;
    align-items: center;
    justify-content: center;
	height: 20vh;
	min-height: 300px;
    background-image: linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.3));
    background-position: center;
    background-size: cover;
    text-align: center;
}

color{
    font-weight: bold;
    color: #A50021;
}

/*テーブルの設定共通*/
table{
    border-collapse: collapse;
    border: 4px solid #404040;
    margin-top: 10px;
    margin-bottom: 10px;

}
td{
    border: 2px solid #404040;
    padding: 0.5rem;
}
th{
    border: 2px solid #404040;
    padding: 0.3rem;
    background-color: #E6E6E6;
}

/********************************************
    全ページ共通：フッター部分
*********************************************/
footer{
    color: white;
    background-color: #6E3546;
    background-image: url(../images/footer_img.jpg);
    background-size: contain;
}
footer .container{
    padding: 40px 20px;
}

/*フッター全体画面サイズに対応して比率を設定*/
@media (min-width: 768px) {
	footer .container {
		display: flex;
		flex-wrap: wrap;
		max-width: 1000px;
		margin-left: auto;
		margin-right: auto;
	}
	.footA {
		flex: 0 0 40%;
	}
	.footB {
		flex: 0 0 60%;
	}
	.footC {
		flex: 0 0 100%;
	}
}

/*うさぎ事務所基礎情報*/
.footA h2{
    margin-top: 0;
    margin-bottom: 10px;
    font-family: 'Montserrat',sans-serif;
    font-size: 20px;
    letter-spacing: 0.2em;
}
.footA{
    margin-bottom: 30px;
}
.footA p {
	margin-top: 0;
	margin-bottom: 0;
	font-size: 14px;
}
/*メニュー*/
.footB div{
    margin-bottom: 20px;
}
.footB h3{
    margin-top: 0;
    margin-bottom: 10px;
    border-bottom: solid 1px currentColor;
    font-size: 14px;
}
.footB ul{
    margin: 0;
    padding: 0;
    list-style: none;
}
.footB a{
    display: block;
    padding: 5px;
    color: inherit;
    font-size: 12px;
    text-decoration: none;
}
.footB a:hover{
    background-color: #A50021;
}
/*メニュー部分を画面サイズに対応する*/
@media (min-width: 768px) {
	.footB {
		display: flex;
	}
	.footB div {
		flex: 1;
	}
	.footB div:not(:first-child) {
		margin-left: 40px;
	}
}
/*コピーライト*/
.footC{
    font-size: 12px;
    text-align: center;
}
/********************************************
    【共通】ヘッダーナビゲーション
*********************************************/
/*ヘッダーを重ねる*/
header{
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100; /*重なり順　大きいほど上*/
    width: 100%;
    background-color: rgba(255,255,255,0.8);
    position: fixed; /*ナビゲーションを固定する*/
}

/*ヘッダーA：サイト名*/
.headA{
    display: inline-block;
    line-height: 50px;
    padding-left: 20px;
    padding-right: 20px;
    background-color:#6E3546;
    /*background-image: url(../images/logo.png);*/
    /*background-size: contain;*/
    color:white;
    font-family: 'Montserrat',sans-serif;
    font-size: 18px;
    font-weight: bold;
    text-decoration: none;
    letter-spacing: 0.1em;
}
/*ヘッダーB　ナビゲーション*/
.headB ul{
    margin: 0;
    padding: 0;
    list-style: none;
}
.headB a{
    display: block;
    padding: 10px 15px 10px 15px;
    color: inherit;
    font-size: 16px;
    font-weight: bold;
    text-decoration: none;
    letter-spacing: 0.05em;
}
.headB a:hover{
    background-color:#E6BEAA ;
}
/*画面のサイズが大きいときは並べる*/
@media (min-width: 800px) {
    header .container{
        display: flex;
        align-items: center;
        justify-content: space-between;
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
    }
    .headB ul{
        display: flex;
    }
}


/*トグルボタン 画面が大きいとき*/
@media (min-width: 800px) {
    .headC{
        display: none; /*画面が大きいときは非表示*/
    }
    .headB{
        display:block !important;
    }
    
}
/*トグルボタン 画面が小さいとき*/
@media (max-width:799px){
    .header .container-small{
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .headC{
    display: inline-block;
    background-color: #E6BEAA;
    padding: 10px;
    font-family: 'Philosopher',sans-serif;
    font-size: 14px;
    font-weight: bold;
    cursor: pointer;
}
    .headC:hover{
        opacity: 0.3;
    }
    .headB{
        display: none;
    }
}

/********************************************
    トップページ：index.html
*********************************************/
/*-------------------------
トップイメージ
--------------------------*/
.conA{
    display: flex;
    align-items: center;
    justify-content: center;
	height: 30vh;
	min-height: 400px;
    background-image: linear-gradient(rgba(0,0,0,0.1), rgba(0,0,0,0.1)), url(../images/jimusho-gaiyo.jpg);
    background-position: center;
    background-size: cover;
    color: #262626;
    text-align: center;
}

/*うさぎ社会保険労務士事務所*/
.conA h1{
    margin-top:0;
    margin-bottom: 0;
    font-family: 'Montserrat',sans-serif;
    font-size: 24px;
	letter-spacing: 0.1em;
	margin-left: 0.2em;
}
/*誰もが輝く職場づくり*/
.conA p{
    margin-top:0;
    margin-bottom: 0;
    font-size: 18px;  
}
/*ロゴ*/
.conA img{
    width: 10%;
}
/*メルマガ登録フォームへのボタン*/
.conA a {
	display: inline-block;
	margin-top: 20px;
	padding: 10px 30px;
	border: solid 3px currentColor;
	border-radius: 6px;
	background-color: var(--accent-color);
	color: #fff;
	color: var(--text-bright-color);
	font-size: 18px;
    font-weight: bold;
	text-decoration: none;
}

/*ボタンを押したときに透明になる*/
.conA a:hover	{
	background-image: linear-gradient(
		rgba(255,255,255,0.2),
		rgba(255,255,255,0.2)
	);
}


/*画面の大きさにあわせてフォントを変える*/
@media (min-width: 768px) {
	.conA h1 {
		font-size: 42px;
	}

	.conA p {
		font-size: 24px;
	}
}
/*-------------------------
新着情報
--------------------------*/
.news-area .text{
    font-size: 16px;
    padding: 20px;
}
.news-area img{
    height: 150px;
}

.news-area a {
	display: inline-block;
    color: #A50021;
	text-decoration: none;

}

/*ボタンを押したときに透明になる*/
.news-area a:hover	{
	background-color: #E6BEAA;
	);
}


.news-area .mail-form {
	display: inline-block;
	margin-left: 10px;
	padding: 10px 40px;
	border: solid 3px currentColor;
	border-radius: 6px;
	background-color: #A50021;
	background-color: var(--accent-color);
	color: #fff;
	color: var(--text-bright-color);
	font-size: 16px;
    font-weight: bold;
	text-decoration: none;
}


@media(min-width:769px){
    
    .news-area  .container{
        display: flex;
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
        flex-wrap: wrap;    
    }

    .news-area  .text{
        flex: 0 0 75%;
    }
    .news-area  .media-box{
        flex: 0 0 25%;

    }

    }
/*-------------------------
ごあいさつ
--------------------------*/
/*見出し*/
.conC color{
    color: #A50021;
}

/*テキストフィールド*/
.conC .text{
    font-size: 14px;
    padding: 20px;
    margin-top: 10px;
    
}

/*大西千織*/
.conC h2{
    margin-top: 0;
    margin-bottom: 10px;
    font-size: 16px;
    /*line-height: 1.8;   /*行の高さを調整*/
    opacity: 0.8;       /*透明度の設定*/
    text-align: right;
}
/*プロフィール写真*/
.conC .photo{
    min-height: 380px;
    background-image: url(../images/pro_img1.jpg);
    background-position: center;
    background-size: cover;
}
/*ごあいさつ部分を画面のサイズに対応する*/
@media(min-width:769px){
    
    .conC .container{
        display: flex;
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
        flex-wrap: wrap;    
    }
    .conC .title{
        flex: 0 0 100%;
    }
    .conC .photo{
        flex: 0 0 45%;
    }
    .conC .text{
        flex: 0 0 55%;
        padding:10px;
    }
    }
/*-------------------------
うさぎ事務所の由来
--------------------------*/
.conB .title bold{
    font-size: 18px;
}
.conB color{
    color: #A50021;
}
/*ロゴエリア*/
.conB .photo{
    height: 220px;
    margin: 20px 0 ;
    background-image: url(../images/logo.png);
    background-size: contain;
    background-position: center;

}
/*リストエリア*/
.conB .list{
    margin: 0;
}
.conB div{
    margin-bottom: 10px;
}
/*見出し*/
.conB h3{
    margin-top: 0;
    padding: 5px 0 0 5px;
    margin-bottom: 0;
    border-bottom: solid 1px #767676;
    font-size: 16px;
    background-color: #6E3546; /*#FFDAC'*/
    color: white;
}
.conB ul{
    margin: 0;
    padding-left: 5px;
    list-style: none; /*「・」を表示させない*/
    font-size: 14px;
}
/*見出しの補足*/
.conB h4{
    font-size: 14px;
    font-weight: bold;
    background-color: #E6BEAA;
}
/*中央に寄せる*/
.conB .container{
    margin-top: 10px;
    margin-bottom: 0;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    
}
/*画面のサイズが大きいときは横に並べる*/
@media(min-width:769px){
    .conB .container{
        display: flex;
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
        flex-wrap: wrap;
        align-items: flex-start;
    }
    .conB .photo{
        flex: 0 0 40%;
    }
    .conB .list{
        flex: 0 0 60%;
        padding:10px;
    }
    }
/*-------------------------
事務所サービスについて
--------------------------*/
/*中央に寄せる*/
.service-map .container{
    margin-top: 10px;
    margin-bottom: 0;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    
}
.service-map .text{
    margin:10px 10px 0px 10px;
    padding: 10px;
}
.service-map .map{
	height: 40vh;
	max-height: 300px;
    margin-left: 20px ;
    background-image: url(../images/service_map.png);
    background-size: contain;
    background-position: left;

}

/*-------------------------
事業者向けサービス(社労士)
--------------------------*/
.jigyousha .photo{
    min-height: 150px;
    background-position: center;
    background-size: cover;
}
.jigyousha  h2{
    font-size: 16px;
    background-color: #1F171F;
    color: white;
    padding: 10px;
    text-align: center;
}
.jigyousha .text{
    padding: 10px;
}
.jigyousha  a{
    margin: 10px;
    display: block;
    border: solid 2px #C9C9C9;
    color: inherit;
    text-decoration: none;
}
.jigyousha  a:hover{
    opacity: 0.8;
}
.jigyousha  .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-wrap: wrap;
}
.jigyousha article{
    flex: 1 1 300px;
}
/*-------------------------
その他
--------------------------*/
.others .photo{
    min-height: 150px;
    background-position: center;
    background-size: cover;
}
.others  h2{
    font-size: 16px;
    background-color:#4D4D4D;
    color: white;
    padding: 10px;
    text-align: center;
}
.others .text{
    padding: 10px;
}
.others  a{
    margin: 10px;
    display: block;
    border: solid 2px #C9C9C9;
    color: inherit;
    text-decoration: none;
}
.others  a:hover{
    opacity: 0.8;
}
.others  .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-wrap: wrap;
}
.others article{
    flex: 1 1 300px;
}
/*-------------------------
サービス
--------------------------*/
.listA color{
    color: #A50021;
}
.listA .title-2{
    margin-top: 10px;
    display: flex;
    height: 50px;
    align-items: center;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
.listA .title-2 img{
    margin-left: 10px;
    height: 40px;
}
.listA .title-2 h2{
    margin-left: 10px;
}
.listA .container{
    display: flex;
    flex-wrap: wrap;
    max-width: 850px;
    margin: 0 auto;
}
.listA article{
    flex: 1 1 300px;
    display: flex;
}
.listA a{
    margin: 10px;
    flex: 1;
    display: block;
    border: solid 1px #ddd;
    color: inherit;
    text-decoration: none;
}
.listA a:hover{
    opacity: 0.8;
}
/*写真*/
.listA .photo{
    min-height: 200px;
    background-position: top;
    background-size: cover;
}

.listA h2{
    font-size: 18px;
}
.listA p2{
    font-weight: bold;
    background-color: #E6BEAA;
    font-size: 14px;
}
.listA p{
    font-size: 16px;
}
.listA .text{
    margin: 10px;
}
/*-------------------------
お問い合わせ
--------------------------*/
.conE h2{
    margin-top: 10px;
    margin-bottom: 10px;
    font-family: 'Montserrat',sans-serif;
    font-size: 20px;
    letter-spacing: 0.1em;
}

.conE .container{
    max-width: 850px;
    margin-left: auto;
    margin-right: auto;
}
.conE .contact{
    margin-top: 0;
    margin-bottom: 20px;
}
/*画面のサイズが大きいときは横に並べる*/
@media(min-width:768px){
    .conE .container{
        display: flex;
        max-width: 850px;
        margin-left: auto;
        margin-right: auto;
        align-items: flex-start;
        justify-content: space-between;
 
    }
}

/********************************************
    ランディングページ：lp.html
*********************************************/
/*-------------------------
トップ
--------------------------*/
.lp-A .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
.lp-A .lp-head{
    line-height: 50px;
    padding:10px;
    background-color:#6E3546;
    color:white;
    font-family: 'Montserrat',sans-serif;
    font-size: 28px;
    font-weight: bold;
    letter-spacing: 0.2em;
    text-align: center;
}
/*プロフィール写真*/
.lp-A .photo{
    height: 350px;
    max-width: 500px;
    background-image: url(../images/logo.png),url(../images/pro_img1.jpg); /*画像を重ねる*/
    background-position: right center,left center;
    background-size: 120px,contain;


}
/*プロフィールへのリンク*/
.lp-A .button-red {
	display: inline-block;
	padding: 10px 20px;
	border: solid 3px currentColor;
	border-radius: 6px;
	background-color: #A50021;
	background-color: var(--accent-color);
	color: #fff;
	color: var(--text-bright-color);
	font-size: 16px;
    font-weight: bold;
	text-decoration: none;
    justify-content: center;
    align-items: center;
}

/*ボタンを押したときに透明になる*/
.lp-A .button-red:hover	{
	background-image: linear-gradient(
		rgba(255,255,255,0.2),
		rgba(255,255,255,0.2)
	);
}

/*テキストフィールド*/
.lp-A .text{
    padding: 20px;
    font-size: 16px;
}
/*ボタンを中央に*/
.lp-A .photo-area{
    text-align: center;
    max-width: 500px;
}
/*モットーを囲う*/
.lp-A .squere{
    padding: 10px;
    border: outset 0.2rem #E6BEAA;
    
}

/*画面のサイズに対応する*/
@media(min-width:768px){
    
    .lp-A .container{
        display: flex;
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
        flex-wrap: wrap;
        margin-bottom: 20px;
    }

    .lp-A .photo-area{
        flex: 0 0 50%;
    }
    .lp-A .text{
        flex: 0 0 50%;
        padding:20px;

    }
    }

/*-------------------------
うさぎ事務所の３つの特徴
--------------------------*/
.lp-B{
    padding-top: 10px;
    
}
.lp-B .lead{
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
}
.lp-B h2{
    font-size: 16px;
    margin-left: 20px;
    padding: 10px;
    font-weight: normal;
    margin-bottom: 20px;
}

/*特徴１と３*/
.tokucho-A {
    background-color: #E6E6E6;
}
.tokucho-A .text{
    padding: 20px;
}
.tokucho-A h3{
    margin-top: 0;
    margin-bottom: 10px;
    font-size: 18px;
    padding-left: 10px;
    border-left: solid 0.5rem #A50021;
    border-bottom: solid 0.2rem #A50021;
}
.tokucho-A p{
    margin-top: 0;
    font-size: 15px;
    line-height: 1.8;
    padding: 10px;
}

.tokucho-A .photo{
    min-height: 200px;
    margin: 10px;
    background-image: url(../images/workplace.jpg);
    background-position: center;
    background-size: contain;
}
@media(min-width:768px){
    .tokucho-A .container{
        display: flex;
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
    }
    .tokucho-A .photo{
        flex: 1;
    }
    .tokucho-A .text{
        flex:2;
        padding: 20px;
    }
}
/*職場環境改善*/
.tokucho-B .container{
    padding-top: 10px;
}

.tokucho-B .text{
    padding: 20px;
}
.tokucho-B h3{
    margin-top: 0;
    margin-bottom: 10px;
    font-size: 18px;
    border-left: solid 0.5rem #A50021;
    border-bottom: solid 0.2rem #A50021;
    padding-left: 10px;
}
.tokucho-B p{
    margin-top: 0;
    font-size: 15px;
    line-height: 1.8;
    padding: 10px;
}

.tokucho-B .photo{
    min-height: 200px;
    margin: 10px;
    background-image: url(../images/workplace.jpg);
    background-position: center;
    background-size: cover;
}
@media(min-width:768px){
    .tokucho-B .container{
        display: flex;
        flex-direction: row-reverse;
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
        padding: 20px 0;
    }
    .tokucho-B .photo{
        flex: 0 0 300px;
    }
    .tokucho-B .text{
        flex:1;
        padding: 20px;
    }
}
/*-------------------------
サービス紹介
--------------------------*/
.lp-C .photo{
    min-height: 150px;
    background-position: center;
    background-size: cover;
}
.lp-C  h2{
    font-size: 16px;
    background-color: #404040;
    color: white;
    padding: 10px;
    text-align: center;
}
.lp-C .text{
    padding: 10px;
}
.lp-C  a{
    margin: 10px;
    display: block;
    border: solid 2px #C9C9C9;
    color: inherit;
    text-decoration: none;
}
.lp-C  a:hover{
    opacity: 0.8;
}
.lp-C  .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-wrap: wrap;
}
.lp-C article{
    flex: 1 1 300px;
}
/*-------------------------
キャンペーン実施中
--------------------------*/
.lp-D{

    padding-top: 10px;
    
}
.lp-D .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    
}
.lp-D .tokuten{
    margin: 20px;
}
.lp-D h2{
    font-size: 20px;
}
.lp-D h3{
    font-size: 18px;
    margin: 10px;
    padding-left: 10px;
    border-left: solid 0.5rem #A50021;
    border-bottom: solid 0.1rem #A50021;
}
.lp-D h4{
    font-size: 16px;
    margin-top: 10px;
}
.lp-D img{
    height: 200px;
    margin: 10px;
}
.lp-D .text{
    font-weight: normal;
}
.lp-D .text-2{
    font-weight: bold;
    margin: 10px;
}
.lp-D .button-position{
    text-align: right;
}
.lp-D bold{
    font-size: 18px;
    font-weight: bold;
    background-color: #A50021;
    color: white;
    padding: 0 20px 0 20px;
    margin: 10px;
    
}
/*画面が大きいときは横に並べる*/
@media(min-width:769px){
    .lp-D .present{
        display: flex;
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
        align-items: flex-start;
        justify-content: space-between;
        flex: 1;
    }
}
/*-------------------------
お問い合わせ
--------------------------*/
.lp-E h2{
    margin-left: 20px;
    margin-top: 10px;
    font-size: 16px;
}
.lp-E .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
.lp-E .contact{
    display: flex;
    align-items: center;
}

.lp-E img{
    height: 150px;
    margin-left: 10px;
}

/*.lp-E .photo{
    background-image: url(../images/pro_img3.jpg);
    background-size: contain;
    height: 150px;
    width: auto;
}*/
/*画面のサイズが大きいときは横に並べる*/
@media(min-width:769px){
    .lp-E .container{
        display: flex;
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
        align-items: flex-start;
        justify-content: space-between;
    }
}

/********************************************
    事務所概要：jimusho.html
*********************************************/
/*-------------------------
トップimage
--------------------------*/
.image-A h1{
    margin-top:0;
    margin-bottom: 0;
    font-family: 'Montserrat',sans-serif;
    font-size: 36px;
	letter-spacing: 0.4em;
	margin-left: 0.2em;
}
/*-------------------------
代表プロフィール
--------------------------*/
.jimusho-B .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
.jimusho-B .photo{
    min-height: 400px;
    background-image: url(../images/pro_img2.jpg);
    background-size: contain;
}
.jimusho-B img{
    height: 130px;
}
.jimusho-B h2{
    font-size: 20px;  
}
.jimusho-B .name{

    padding-left: 20px;
}

.jimusho-B .name-box{
    padding: 10px;
    margin: 20px;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    border-bottom: double 0.5rem #6E3546;
}
.jimusho-B .text{
    padding: 10px;
    margin: 20px;
}
/*画面のサイズに対応する*/
@media(min-width:769px){
    
    .jimusho-B .container{
        display: flex;
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
        flex-wrap: wrap;    
    }

    .jimusho-B .photo{
        flex: 0 0 40%;
    }
    .jimusho-B .text-area{
        flex: 0 0 60%;
    }
    }

/*-------------------------
自己紹介
--------------------------*/
.jimusho-C .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
.jimusho-C .text-block{
    padding: 20px;
}
.jimusho-C h3{
    background-color: #C9C9C9;
}
.jimusho-C h4{
    padding: 10px;
    font-weight: normal;
}
.jimusho-C h5{
    border: outset 0.2rem #E6BEAA;
    padding: 10px;
    margin-bottom: 10px;
    font-size: 16px;
    font-weight: normal;
}
.jimusho-C color{
    color: #A50021;
}
/*-------------------------
事務所プロフィール
--------------------------*/
.jimusho-D .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
    margin-bottom: 20px;
}
.jimusho-D table{
    width: 360px;
    height: 300px;
    margin: 10px;
    border-collapse: collapse;
    border: 4px solid #404040;

}
.jimusho-D td{
    border: 2px solid #404040;
    padding: 0.8rem;
}

.jimusho-D .text{
    margin: 10px;
    padding: 10px;
    
}
.jimusho-D .location-map{
    margin-left: 20px;
}
.jimusho-D color{
    color: #A50021;
    font-size: 18px;
}
.jimusho-D .photo{
    min-height: 300px;
    margin: 10px;
    background-image: url(../images/kanban.jpg);
    background-position: center;
    background-size: contain;
}
@media(min-width:768px){
    .jimusho-D .photobox{
        display: flex;
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
    }
    .jimusho-D .photo{
        flex: 2;
    }
    .jimusho-D table{
        flex:2;
        padding: 20px;
    }
}
/********************************************
    事業診断：shindan.html
*********************************************/
/*-------------------------
トップimage ※雇用ページも同じ
--------------------------*/
.image-A2 h1{
    margin-top:0;
    margin-bottom: 0;
    font-family: 'Montserrat',sans-serif;
    color: black;
    padding: 10px;
    font-size: 36px;
	letter-spacing: 0.5em;
	margin-left: 0.2em;
}
/*-------------------------
　変革に向けた第一歩
--------------------------*/
.shindan-A .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
.shindan-A .list{
    padding: 10px;
    margin: 10px;
    list-style: none;
    line-height: 1.5;
    background-color: #E6E6E6;
}
/*うさぎアイコンつきリスト*/
.shindan-A .usagi{
    padding-left: 40px;
    background: url(../images/usagi-icon.svg) 0 0.2rem no-repeat;
    background-position: left;
}
.shindan-A .text{
    padding: 10px;
    margin: 10px;
}
.shindan-A  .photo{
    min-height: 280px;
    margin: 10px;
    background-image: url(../images/shindan.png);
    background-position: left;
    background-size: contain;
}
/*-------------------------
　文書化
--------------------------*/
.shindan-B .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
.shindan-B .text{
    margin: 10px;
    padding: 10px;
}

/*-------------------------
　ケース
--------------------------*/
.case{
    padding: 10px;
}
.case .text{
    padding: 10px;
    margin-left: 20px;
}
.case h3{
    margin-top: 0;
    margin-bottom: 10px;
    font-size: 18px;
}
.case p{
    margin-top: 0;
    margin-bottom: 10px;
    font-size: 14px;
    line-height: 1.8;
}

.case .photo{
    min-height: 200px;
    margin: 10px;
    background-image: url(../images/hojokin.jpg);
    background-position: center;
    background-size: cover;
}
@media(min-width:768px){
    .case .container{
        display: flex;
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
    }
    .case .photo{
        flex: 2;
    }
    .case .text{
        flex:3;
        padding: 10px;
    }
}

/*-------------------------
　サービスの流れ
--------------------------*/
.shindan-D .container{
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
}
.shindan-D h3{
    font-size: 18px;
}
.shindan-D .text{
    margin-left: 50px;
}
.shindan-D .process{
    margin: 10px 0 0 10px;
}
.shindan-D  .photo{
    min-height: 180px;
    margin: 10px;
    background-image: url(../images/report.png);
    background-position: left;
    background-size: contain;
}

/********************************************
    障害者雇用伴走型支援：koyou.html
*********************************************/
/*--------------------------
  導入
-------------------------- */
.koyou-B .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
.koyou-B .text{
    padding: 10px;
    margin-left: 10px;
}
.koyou-B .checklist-1{
    padding: 10px 10px 10px 40px;
    background-color: #E6BEAA;
}
.koyou-B ol{
    list-style-type:decimal;
        line-height: 1.8;
    padding: 10px;
}

.koyou-B .checklist-2{
    padding: 20px 20px 0 40px;
    background-color: #E6E6E6;
    border: solid 0.1rem #404040;
}
.koyou-B h2{
    font-size: 18px;
    border-bottom: solid 2px #A50021;
}

/*--------------------------　
　概要
-------------------------- */
.koyou-C h2{
    margin-top: 30px;
    font-size: 2vw;
    text-align: center;
}
.koyou-C h1{
    padding: 20px;
    font-size: 3vw;
    text-align: center;
    background-color: #404040;
    color: white;
    letter-spacing: 0.2em;
}
.koyou-C bold{
    font-size: 1.5vw;
    text-align: center;
}

.koyou-C .text{
    padding: 10px;
}
.koyou-C .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
/*画面のサイズに対応する*/
@media(min-width:769px){
  /*横に並べる　両端にあわせる*/  
    .koyou-C .container{
        display: flex;
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
        padding: 10px;
        justify-content: space-between;
        align-items: flex-start;
    }
    }
/*小さいデバイスの時のサービスタイトル表示調整*/
@media (max-width: 450px) {
    .koyou-C .service h1{
        font-size: 18px;
    }
        .koyou-C .service h2{
        font-size: 18px;
    }
    .koyou-C .service bold{
        font-size: 16px;
    }
}
/*--------------------------　
 進め方と支援サービス
-------------------------- */
/*共通ルール*/
.koyou-D .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}

.koyou-D .text{
    padding: 10px;

}
.koyou-D .icon-box{
    margin: 10px;
}
/*左側にスペースをつくる*/
.koyou-D .process-box{
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: 40px; 
}
.koyou-D .point{
    display: inline-block;
    background-color: #A50021;
    color: white;
    font-weight: bold;
    padding: 10px 20px;
    border-radius: 6px;

}
.koyou-D .process-text{
    margin-top: 10px;
}
/*画面が大きいときは写真とテキスト横に並べる*/
@media(min-width:768px){
    .koyou-D .photo-box{
        display: flex;
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
        align-items: flex-start;
        justify-content: space-between;
        flex: 1;
    }
}
/*ピンク色のテキストボックス*/
.koyou-D .text-list{
    margin: 10px 20px 0 20px;
    background-color: #C9C9C9;
    padding: 10px;   
}
/*挿入画像*/
.koyou-D img{
    height: 200px;
    margin: 10px;
}
/*ボックス*/
.koyou-D .hasen-box{
    padding: 10px;
    margin: 10px;
    border: solid 0.1rem #404040;
    background-color: #E6E6E6;
}


/*職場分析*/
.koyou-D h4{
    background-color: #6E3546;
    color: white;
    display: inline-block;
    padding: 5px 20px;
    margin-top: 20px;
    font-size: 16px;
}
.koyou-D h5{
    padding: 10px;
    font-size: 14px;
}

/*画面が大きいときは横に並べる*/
@media(min-width:769px){
    .koyou-D .present{
        display: flex;
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
        align-items: flex-start;
        justify-content: space-between;
        flex: 1;
    }
}
/*業務改革診断のご案内*/
.koyou-D ul{
    margin-left: 20px;
}
.koyou-D .shindan-button{
  	display: inline-block;
	margin: 20px;
	padding: 30px 60px;
	border: solid 3px white; /*輪郭線の色を変える*/
	border-radius: 6px;
    background-image: url(../images/shindan_ig.jpg);
    background-position: center;
    background-size: cover;
    color:#262626;
	font-size: 18px;
    font-weight: bold;
	text-decoration: none;  
}
.koyou-D .shindan-button:hover	{
	opacity: 0.8;
}
.koyou-D .shindan-link{
    margin-bottom: 10px;
}
/*画面が大きいときは横に並べる*/
@media(min-width:769px){
    .koyou-D .shindan-link{
        display: flex;
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
        align-items: flex-start;
        justify-content: space-between;
        flex: 1;
    }
}
/*受入支援固有*/
.koyou-D h6{
    font-size: 16px;
    border-bottom: solid 2px;
    margin-bottom: 10px;
}

/*助成金*/
/*テーブルの設定は共通ルールに準じる*/
/*--------------------------　
 一緒に働く人へ
-------------------------- */
.koyou-F .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
.koyou-F .text{
    padding: 10px;
}
.koyou-F bold{
    font-size: 18px;
    margin-top: 10px;
    background-color: #C9C9C9;
}
/*ボックス*/
.soudan-c .container{
    padding-top: 0px;
    background-color: #E6E6E6;
}
.soudan-c .text{
    padding: 10px;
    margin-left: 20px;
}
.soudan-c h3{
    margin-top: 0;
    margin-bottom: 10px;
    font-size: 18px;
}
.soudan-c p{
    margin-top: 0;
    margin-bottom: 20px;
    font-size: 14px;
    line-height: 1.8;
}
.soudan-c a{
    display: inline-block;
    padding: 10px 30px;
    box-shadow: 0 0 0 1px #888;
    border: solid 3px currentColor;
    border-radius: 6px;
    background-color: #A50021;
    color: white;
    font-size: 16px;
    text-decoration: none;
}
.soudan-c a:hover{
    background-image: linear-gradient(rgba(255,255,255,0.2),rgba(255,255,255,0.2));
}

.soudan-c .photo{
    min-height: 150px;
    margin: 10px;
    background-image: url(../images/soudan-kaigi.jpg);
    background-position: center;
    background-size: cover;
}
@media(min-width:768px){
    .soudan-c .container{
        display: flex;
        flex-direction: row-reverse;
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
        padding: 20px 0;
    }
    .soudan-c .photo{
        flex: 0 0 400px;
    }
    .soudan-c .text{
        flex:1;
        padding: 10px;
    }
}

/*お問い合わせ*/
.koyou-E .text{
    padding: 10px;
}
.koyou-E .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
.koyou-E .button{
    text-align: right;
}
/********************************************
    障害年金　nenkin.html
*********************************************/
.image-A h2{
    font-family: 'Montserrat',sans-serif;
    padding: 10px;
    font-size: 2rem;
	letter-spacing: 0.3em;

}
/*-------------------
    導入
--------------------*/
.nenkin-B .text{
    padding: 10px;
}
/*障害年金を検討ください*/
.nenkin-B h3{
    border-bottom: solid 2px #A50021;
    margin-left: 10px;
}

.nenkin-B .box{
    margin: 10px;
}

/*相談してみませんか？*/
.nenkin-B h2{
    display: inline-block;
    font-size: 18px;
    background-color: #A50021;
    color: white;
    padding: 5px 20px;
}
.nenkin-B ul{
    padding: 10px;
    background-color: #C9C9C9;
}
.nenkin-B li{
    margin-left: 20px;
}
/*体験談へのリンク*/
.nenkin-B .taiken-link{
    color: #A50021;
    text-decoration: none;
    font-weight: bold;
}
.nenkin-B .taiken-link:hover{
    background-color:#E6BEAA ;
}
/*-------------------
    サービスの流れ
--------------------*/
/*裁定請求代行のケース*/
.nenkin-C h2{
    font-size: 16px;
    background-color: #E6E6E6;
    padding: 5px 0 0 5px;
}
/*プロセスの見出し*/
.nenkin-C h3{
    font-size: 18px;
}
.nenkin-C .text{
    margin-left: 50px;
}
.nenkin-C .process{
    margin: 10px 0 0 10px;
}
.nenkin-C .button-B{
    margin-left: 40px;
}
.nenkin-C .point-1{
    padding: 10px;
    margin: 10px 10px 0 50px;
    background-color: #E6E6E6;
    border: solid 0.1rem #404040;
}
.nenkin-C .point-2{
    padding: 10px;
    margin: 10px 10px 10px 50px;
    background-color: #C9C9C9;
        border: solid 0.1rem #404040;
}
/*-------------------------
 報酬…SMALL表示
画面が大きいときは他のページと同じ
-------------------------*/
.nenkin-D .small-case{
    margin-left: 40px;
}
.nenkin-D .menu{
    background-color: #E6E6E6;
    font-weight: bold;
    padding-left: 10px;
}
.nenkin-D .naiyo{
    padding: 10px;
}
.nenkin-D .price{
    padding: 10px;
    margin-bottom: 10px;
    border: outset 0.2rem #E6E6E6;
}
/*画面が大きいときはsmall-caseは表示させない*/
@media(min-width:768px){
    .nenkin-D .small-case{
        display: none;
    }
    }
/*画面が小さいときはtableを表示させない*/
@media(max-width:767px){
    .nenkin-D table{
        display: none;
    }
    }

/*-------------------------
 体験談
-------------------------*/
.nenkin-E img{
    height: 200px;
}
.nenkin-E .profile{
    padding: 10px;
    text-align: center;
}
.nenkin-E .taiken-text{
    font-size: 15px;
    padding: 20px;
}
/*画面が大きいときは横に並べる*/
@media(min-width:768px){
    .nenkin-E .taiken-box{
        display: flex;
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
        align-items: center;
    }
}
.nenkin-E .taiken-shien{
    font-size: 15px;
    padding: 20px;
    background-color: #E6E6E6;
}
.nenkin-E a{
    justify-content: right;
}
.nenkin-E a{
    display:inline;
    padding: 5px 10px;
    background-color: #A50021;
    color: white;
    text-decoration: none;
}
.nenkin-E a:hover{
    opacity: 0.8;
}
/*-------------------------
 お問い合わせ
-------------------------*/
.nenkin-F .contact-box{

}
.nenkin-F .text-box{
    margin-left: 10px;
    padding: 10px;
}


/*画面が大きいときは横に並べる*/
@media(min-width:768px){
    .nenkin-F .container-basic{
        display: flex;
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
        align-items: flex-start;
        justify-content: space-between;
        flex: 1;
    }
    
}

/*-------------------------
 お役立ちトピックス
-------------------------*/
.nenkin-G .text{
    padding: 10px;
    margin: 10px;
}
.nenkin-G .photo{
    min-height: 150px;
    background-position: center;
    background-size: cover;
}
.nenkin-G h2{
    font-size: 16px;
    background-color: #404040;
    color: white;
    padding: 10px;
    text-align: center;
}
.nenkin-G a{
    margin: 10px;
    display: block;
    border: solid 1px #ddd;
    color: inherit;
    text-decoration: none;
}
.nenkin-G a:hover{
    opacity: 0.8;
}
.nenkin-G .nenkin-menubox{
    display: flex;
    flex-wrap: wrap;
}
.nenkin-G article{
    flex: 0 0 240px;
}


/*-------------------------
 携帯端末に対応する
-------------------------*/
@media(max-width:420px){
    .nenkin-B, .nenkin-C, .nenkin-D, .nenkin-F{
        font-size: 15px;
    }
    .nenkin-E{
        font-size: 14px;
    }
    .title h1{
        font-size: 18px;
    }
    .nenkin-B h3{
        font-size: 15px;
    }
    .nenkin-B h4{
        font-size: 15px;
    }
    .icon-title h3{
        font-size: 15px;
    }
    .image-A h2{
        font-size: 24px;
    }
    
}

/********************************************
   就労相談　soudan.html
*********************************************/
/*-------------------------
 導入
-------------------------*/
.soudan-B .text{
    padding: 10px;
    margin-right: 10px;
}
.soudan-B img{
    height: 200px;
    margin-left: 10px;
    margin-top: 10px;
}
.soudan-B h3{
    border-bottom: solid 2px #A50021;
    margin-left: 10px;
}


}
@media(min-width:768px){
    .soudan-B .container-basic{
        display: flex;
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
        align-items: flex-start;
        justify-content: space-between;
        flex: 1;
    }
}
/*-------------------------
就労相談
-------------------------*/
.soudan-C .container{
    max-width: 1000px;
    margin: 0 auto;
}
.soudan-C .text{
    padding: 10px;
}
/*ボックス*/
.soudan-p{
    background-color: #E6E6E6;
        max-width: 1000px;
        margin: 0 auto;
    padding: 10px;
    margin-top: 10px;
}
.soudan-p .text{
    padding: 20px;
}
.soudan-p h3{
    margin-top: 0;
    margin-bottom: 10px;
    font-size: 18px;
}
.soudan-p p{
    margin-top: 0;
    margin-bottom: 20px;
    font-size: 14px;
    line-height: 1.8;
}
.soudan-p a{
    display: inline-block;
    margin-top: 10px;
    padding: 10px 50px;
    border: solid 3px currentColor;
    border-radius: 6px;
    background-color: #00CC00;
    color: white;
    font-size: 16px;
    font-weight: bold;
    text-decoration: none;
}
.soudan-p a:hover{
    background-image: linear-gradient(rgba(255,255,255,0.2),rgba(255,255,255,0.2));
}
.soudan-p .photo{
    min-height: 200px;
    margin: 10px;
    background-position: center;
    background-size: cover;
}

@media(min-width:768px){
    .soudan-p .container{
        display: flex;
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
    }
    .soudan-p .photo{
        flex: 2;
    }
    .soudan-p .text{
        flex:3;
        padding: 20px;
    }
}

/*-------------------------
 アドバイザーについて
-------------------------*/
.soudan-D .pro{
    padding: 10px;
    margin-right: 50px;
}
.soudan-D .text{
    padding: 10px;
    margin-bottom: 50px;
}
@media(min-width:768px){
    .soudan-D .profile-box{
        display: flex;
        align-items: flex-start;
        flex: 1;
        border-bottom: double 5px #A50021;
    }
}
/*-------------------------
 就労支援
-------------------------*/
.soudan-E .text{
    padding: 10px;
}
.soudan-E li{
    margin-left: 30px;
}
/*画面が大きいときは横に並べる*/
@media(min-width:768px){
    .soudan-E .photo-box{
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        flex: 1;
    }
}
/*-------------------------
 携帯端末に対応する
-------------------------*/
@media(max-width:420px){
    .soudan-B, .soudan-C, .soudan-D, .soudan-E{
        font-size: 15px;
    }
    }
/********************************************
    お問い合わせ　contact.html
*********************************************/
.image-A2 h2{
    font-family: 'Montserrat',sans-serif;
    padding: 10px;
    font-size: 2rem;
	letter-spacing: 0.3em;

}
/*-------------------------
 メッセージ
-------------------------*/
.contact-B img{
    height: 200px;
}
.contact-B .text{
    padding: 10px;
}
.contact-B .blog-link{
    margin: 10px;
}
/*-------------------------
 事業復活支援金に関して
-------------------------*/
.contact-B color{
    color: "#A50021";
    font-weight: normal;
    background-color: bisque;
}
.contact-B .infomation{
    padding: 10px;
    margin: 10px;
    border: solid 2px #A6A6A6;
}
.contact-B .gentei{
    padding: 10px;

}
/*画面が大きいときは横に並べる*/
@media(min-width:768px){
    .contact-B .message{
        display: flex;
        padding: 10px;
        margin-top: 10px;
    }
}
/*画面が小さいときは写真非表示*/
@media(max-width:420px){
    .contact-B img{
        display: none;
    }
}
.contact-B .form{
  	display: inline-block;
	margin: 20px;
	padding: 30px 60px;
	border: solid 3px #A6A6A6; /*輪郭線の色を変える*/
	border-radius: 6px;
    background-image: url(../images/contact_btn.jpg);
    background-position: center;
    background-size: cover;
    color:#262626;
	font-size: 18px;
    font-weight: bold;
	text-decoration: none;  
}
/*-------------------------
 個人情報
-------------------------*/
.contact-B .policy{
    padding: 10px;
    background-color: #D9D9D9;
}
.contact-B .text-box{
    padding: 0 10px 20px 10px;
    margin-left: 20px;
}
/*個人情報に関する見出し*/
.contact-B h3{
    background-color: #6E3546;
    color: white;
}

/********************************************
    労働社会保険手続き・法定帳簿　hoken.html
*********************************************/
/*-------------------------
 こんな場合に
-------------------------*/
.hoken-A .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}

.hoken-A .list{
    padding: 10px;
    list-style: none;
    line-height:1.5;
    background-color: #E6E6E6;
    margin: 10px;
    list-style-type: square;
    list-style-position: inside;
}
/*-------------------------
 労働社会保険手続き
-------------------------*/
.hoken-B .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
.hoken-B .text{
    padding: 10px;
    margin: 10px;
}
.hoken-B .photo{
    min-height: 280px;
    margin: 10px;
    background-image: url(../images/hoken-map.png);
    background-position: center;
    background-size: contain;
}
/*-------------------------
 対応内容
-------------------------*/
.hoken-C .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}

.hoken-C .list{
    padding: 10px;
    list-style: none;
    line-height:1.5;
    list-style-type: square;
    list-style-position: inside;
}
.hoken-C .text{
    padding: 10px;
}
/*-------------------------
 助成金受給に必要なこと
-------------------------*/
.hoken-D .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
.hoken-D .text{
    padding: 10px;
}
.hoken-D .joseikin-text{
    margin: 10px;
    padding: 20px;
    background-color: #E6E6E6;
    border-style: outset;
    border-color: #404040;
}
.hoken-D .photo{
    min-height: 180px;
    margin: 10px;
    background-image: url(../images/joseikin.jpg);
    background-position: center;
    background-size: contain; 
}
.hoken-D .chobo{
    margin-top: 10px;
}
.hoken-D span{
    margin: 10px;
}

.hoken-D .joseikin-button a{
    display: inline-block;
    padding: 10px 50px;
    margin: 10px;
    border: solid 3px currentColor;
    border-radius: 6px;
    background-color: #A50021;
    color: white;
    font-size: 16px;
    font-weight: bold;
    text-decoration: none;
}
.hoken-D .joseikin-button:hover{
    background-image: linear-gradient(rgba(255,255,255,0.2),rgba(255,255,255,0.2));
}

.hoken-D .kisoku-button a{
    display: inline-block;
    padding: 10px 50px;
    margin: 10px;
    border: solid 3px currentColor;
    border-radius: 6px;
    background-color: #404040;
    color: white;
    font-size: 16px;
    font-weight: bold;
    text-decoration: none;
}
.hoken-D .kisoku-button:hover{
    background-image: linear-gradient(rgba(255,255,255,0.2),rgba(255,255,255,0.2));
}
.hoken-D .text-2{
    padding: 10px;
    background-color: #E6E6E6;
    border-style: double;
    border-color: #404040;
}

@media(min-width:768px){
    .hoken-D .joseikin-area{
        display: flex;
    }
    .hoken-D .photo{
        flex: 1.5;
    }
    .hoken-D .joseikin-text{
        flex:3;
        padding: 20px;
    }
    /*帳簿に装飾をする*/
    .hoken-D span{
    background-color: #404040;
    margin: 10px;
    color: white;
    font-size: 16px;
    padding: 5px 10px;
    font-weight: bold;  
}
    .hoken-D .link{
        display: flex;
        justify-content: space-between;
        margin-bottom: 10px;
    }
    .hoken-D .text-2{
        margin-bottom: 30px;
    }
}
/********************************************
    職場づくり　workplace.html
*********************************************/
/*-------------------------
 多様な人材
-------------------------*/
.wp-A .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}

.wp-A .text{
    padding: 10px;
    margin: 10px;
}
.wp-A .photo{
    min-height: 150px;
    background-position: center;
    background-size: cover;
}
.wp-A h2{
    font-size: 16px;
    background-color: #404040;
    color: white;
    padding: 10px;
    text-align: center;
}
.wp-A a{
    margin: 10px;
    display: block;
    border: solid 1px #ddd;
    color: inherit;
    text-decoration: none;
}
.wp-A a:hover{
    opacity: 0.8;
}
.wp-A .wp-menubox{
    display: flex;
    flex-wrap: wrap;
}
.wp-A article{
    flex: 0 0 240px;
}
/*-------------------------
 生産性向上
-------------------------*/
.wp-B .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}

.wp-B .text{
    padding: 10px;
    margin-left: 10px;
}
.wp-B h3{
    border-left: solid 0.5rem #A50021;
    border-bottom: solid 0.1rem #A50021;
    padding-left: 10px;
    font-size: 18px;
    margin-left: 10px;
}
/*-------------------------
 障害者
-------------------------*/
.wp-C .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
.wp-C .text{
    padding: 10px;
    margin: 10px;
}
.wp-C .list{
    padding: 15px;
    font-size: 14px;
    list-style: none;
    line-height:1.5;
    background-color: #E6E6E6;
    margin: 10px;
    list-style-type: square;
    list-style-position: inside;
}

.wp-C .photo{
    min-height: 150px;
    background-position: center;
    background-size: cover;
}
.wp-C h2{
    font-size: 16px;
    background-color: #404040;
    color: white;
    padding: 10px;
    text-align: center;
}
.wp-C a{
    margin: 10px;
    display: block;
    border: solid 1px #ddd;
    color: inherit;
    text-decoration: none;
}
.wp-C a:hover{
    opacity: 0.8;
}
.wp-C .wp-menubox{
    display: flex;
    flex-wrap: wrap;
}
.wp-C article{
    flex: 0 0 240px;
}

@media(min-width:768px){
    .wp-C .joseikin-area{
    display: flex;
    justify-content: space-between;
    }
}
/*-------------------------
 労務管理
-------------------------*/
.wp-D .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
.wp-D .text{
    padding: 10px;
    margin: 10px;
}
.wp-D .photo{
    min-height: 280px;
    margin: 10px;
    background-image: url(../images/hoken-map.png);
    background-position: center;
    background-size: contain;
}
.wp-D .list{
    margin-left: 20px;
    padding: 10px;
}

/********************************************
    補助金助成金　hojokin-joseikin.html
*********************************************/
/*-------------------------
 補助金助成金活用
-------------------------*/
.hojokin-joseikin .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
.hojokin-joseikin .text{
    padding: 10px;
    margin: 10px;
}
/*-------------------------
 補助金
-------------------------*/
.hojokin .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}

.hojokin .text{
    padding: 10px;
    margin: 10px;
}
.hojokin .merit{
    padding: 15px;
    font-size: 16px;
    list-style: none;
    line-height:1.5;
    background-color: #E6E6E6;
    margin-left: 20px;
    list-style-type: square;
    list-style-position: inside;
}
.hojokin .text-topic{
    font-weight: bold;
    font-size: 16px;
    margin-left: 10px;
    border-bottom: solid 0.1rem #6E3546;
}
.hojokin .text-detail{
    font-size: 16px;
    margin-left: 20px;
    margin-bottom: 10px;
}


.hojokin .list{
    padding: 15px;
    font-size: 16px;
    list-style: none;
    line-height:1.5;
    background-color: #E6E6E6;
    margin-left: 20px;
    list-style-type: square;
    list-style-position: inside;
}

.hojokin .photo{
    min-height: 150px;
    background-position: center;
    background-size: cover;
}
.hojokin h2{
    font-size: 16px;
    background-color: #404040;
    color: white;
    padding: 10px;
    text-align: center;
}
.hojokin a{
    margin: 10px;
    display: block;
    border: solid 1px #ddd;
    color: inherit;
    text-decoration: none;
}
.hojokin a:hover{
    opacity: 0.8;
}
.hojokin .wp-menubox{
    display: flex;
    flex-wrap: wrap;
}
.hojokin article{
    flex: 1 1 240px;
}

/*-------------------------
 助成金ポイント
-------------------------*/
.joseikin .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
.joseikin .text{
    padding: 10px;
}
.joseikin .joseikin-text{
    margin: 10px;
    padding: 20px;
    background-color: #E6E6E6;
    border-style: outset;
    border-color: #404040;
}
.joseikin .photo{
    min-height: 180px;
    margin: 10px;
    background-image: url(../images/hoken.jpg);
    background-position: center;
    background-size: contain; 
}
.joseikin .chobo{
    margin-top: 10px;
}
.joseikin span{
    margin: 10px;
}

.joseikin .text-2{
    padding: 10px;
    background-color: #E6E6E6;
    border-style: double;
    border-color: #404040;
}

@media(min-width:768px){
    .joseikin .joseikin-area{
        display: flex;
    }
    .joseikin .photo{
        flex: 1.5;
    }
    .joseikin .joseikin-text{
        flex:3;
        padding: 20px;
    }
    /*帳簿に装飾をする*/
    .joseikin span{
    background-color: #404040;
    margin: 10px;
    color: white;
    font-size: 16px;
    padding: 5px 10px;
    font-weight: bold;  
}
    .joseikin .link{
        display: flex;
        justify-content: space-between;
        margin-bottom: 10px;
    }
    .joseikin .text-2{
        margin-bottom: 30px;
    }
}

/********************************************
    セミナー情報　seminar.html
*********************************************/
.image-A2 h2{
    font-family: 'Montserrat',sans-serif;
    padding: 10px;
    font-size: 2rem;
	letter-spacing: 0.3em;

}
/*-------------------------
 セミナー画像配置
-------------------------*/
.seminar .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
.seminar .text{
    padding: 10px;
    margin: 10px;
}
.seminar .photo{
    min-height: 450px;
    margin: 10px;
    background-image: url(../images/kokuchi_202410.jpg);
    background-position: left;
    background-size: contain;
}
.seminar .form{
  	display: inline-block;
	margin: 20px;
	padding: 30px 60px;
	border: solid 3px #A6A6A6; /*輪郭線の色を変える*/
	border-radius: 6px;
    background-image: url(../images/contact_btn.jpg);
    background-position: center;
    background-size: cover;
    color:#262626;
	font-size: 18px;
    font-weight: bold;
	text-decoration: none;  
}
.seminar .box{
    padding: 10px;
    margin: 10px;
    background-color: #CDCDCD;
}
/*-------------------------
セミナー実績
--------------------------*/
.seminar-blog .photo{
    min-height: 180px;
    background-position:center;
    background-size: cover;
}
.seminar-blog  h2{
    font-size: 16px;
    background-color:#4D4D4D;
    color: white;
    padding: 10px;
    text-align: center;
}
.seminar-blog .text{
    padding: 10px;
}
.seminar-blog  a{
    margin: 10px;
    display: block;
    border: solid 2px #C9C9C9;
    color: inherit;
    text-decoration: none;
}
.seminar-blog  a:hover{
    opacity: 0.8;
}
.seminar-blog  .container{
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-wrap: wrap;
}
.seminar-blog article{
    flex: 1 1 400px;
}
/*-------------------------
 メッセージ
-------------------------*/
.contact-B img{
    height: 200px;
}
.contact-B .text{
    padding: 10px;
}
.contact-B .blog-link{
    margin: 10px;
}
.contat-B .container-basic .form{
    margin-left: auto;
    margin-right: auto;
}

/*-------------------------
 事業復活支援金に関して
-------------------------*/
.contact-B color{
    color: "#A50021";
    font-weight: normal;
    background-color: bisque;
}
.contact-B .infomation{
    padding: 10px;
    margin: 10px;
    border: solid 2px #A6A6A6;
}
.contact-B .gentei{
    padding: 10px;

}
/*画面が大きいときは横に並べる*/
@media(min-width:768px){
    .contact-B .message{
        display: flex;
        padding: 10px;
        margin-top: 10px;
    }
}
/*画面が小さいときは写真非表示*/
@media(max-width:420px){
    .contact-B img{
        display: none;
    }
}
.contact-B .form{
  	display: inline-block;
	margin: 20px;
	padding: 30px 60px;
	border: solid 3px #A6A6A6; /*輪郭線の色を変える*/
	border-radius: 6px;
    background-image: url(../images/contact_btn.jpg);
    background-position: center;
    background-size: cover;
    color:#262626;
	font-size: 18px;
    font-weight: bold;
	text-decoration: none;  
}
/*-------------------------
 個人情報
-------------------------*/
.contact-B .policy{
    padding: 10px;
    background-color: #D9D9D9;
}
.contact-B .text-box{
    padding: 0 10px 20px 10px;
    margin-left: 20px;
}
/*個人情報に関する見出し*/
.contact-B h3{
    background-color: #6E3546;
    color: white;
}