@import url('https://fonts.googleapis.com/css?family=Noto+Serif+JP');

body{
    font-family: 'Noto Serif JP', sans-serif;
}
@media screen and (min-width: 920px){
    .header{
        width: 100%;
    }
    #header_info{
        display: inline;
        font-weight: bold;
        float:right;
        font-size: 1em;
        margin-top: 0;
        margin-left: 0;
        margin-right: 0;
    }
    #header_icon_sma{
        display: none;
    }

    #header_tel_sma{
        display: none;
    }
    #header_title_sma{
        display: none;
    }

    #header_tel{
        float: right;
    }
 
    .hamburger_menu
    {
        display:none;
    }
	#yohaku{
		display: none;
	}
    /*メニューのCSS*/
    
    .menu_bar ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
        background-color: #1b2538;
    }
    .menu_bar li {
        font-size: 1em;
        list-style-type: none;
        float: left;
        border-left: 0.1rem solid #bbbbbb;
    }
	#menu_bar_menu{
		display: block;
		color:black;	
		text-align: center;
		padding: 0.5rem 0.75rem;
		font-weight: bold;
	}
    .menu_bar li:first-child {
        border-left: none;
    }
    .menu_bar li a {
        display: block;
        color:black;	
        text-align: center;
        padding: 0.5rem 0.75rem;
        font-weight: bold;
    }
    .menu_bar li a:hover:not(.active) {
        background-color: rgba(106, 168, 240, 0.877);
    }
    .active {
        background-color: rgba(106, 168, 240, 0.877);
    } 
    /*ここまでメニューバー*/
    
    /* アイコン */
    .top_pic{
        width:100%;
      }
    .flow_intro{
        display: block;
        padding: 0.5em 0;/*上下の余白*/
        margin-top: 0;
        border-bottom: solid 3px #02b3b7;/*下線*/
    }
    .flow_intro h2{
        display: block;
		padding-top:0.5em;
		padding-bottom:0.5em;
        margin-top:3.0em;
        text-align: center;
		border-top: solid 3px #02b3b7;/*下線*/
        border-bottom: solid 3px #02b3b7;/*下線*/
    }
    .flow_intro p{
        text-align: center;
		font-size:1.5em;
    }
    .instead_br{
        display: block;
        margin-top:2em;
    }
    #parg_margin{
        display: block;
        margin-top:1.5em;
    }
    
    #futsuflow_btn{
        margin-bottom: 0.5em;
        margin-left: 0.5em;
    }
    
    #futsuflow_btn a{
        display: block;
        text-decoration: none;
        font-weight: bold;
        color: #962329;
    }
    #futsuflow_descrition p{
        display: block;
    }
    .futsu_flow h2{
        text-align: center;
        border-bottom: solid 3px #962329 ;
    }
    #kflow_btn a{
        display: block;
        text-decoration: none;
        font-weight: bold;
        color: #962329;
    }
    #kflow_btn{
        margin-bottom: 0.5em;
        margin-left: 0.5em;
    }
    .flow_flex_containar{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-around;
    }
    .flow_flex_containar p{
        margin: 5px;
    }
    .flow_pic{
		border: solid 3px black;
    }
}


/* ーーーーーーーーーーーーーーーーーーーーーースマホ対応ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* ーーーーーーーーーーーーーーーーーーーーーースマホ対応ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* ーーーーーーーーーーーーーーーーーーーーーースマホ対応ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */

@media screen and (max-width: 919px){
	.header{
		width: 100%;
	}
	#header_info{
		display: none;
	}
	#header_info p{
		display: none;
	}
	#header_title{
		display: none;
	}
	#header_tel_sma{
		width:100%;
		text-align: center;
	}
	#header_tel{
		display: none;
	}
	#header_title_sma{
		width: 80%;
	}
	#yohaku{
		height:1px;
		width: 100%;
	}
	@media screen and (max-width:550px) {
		#header_title_sma{
			width: 80%;
			float: left;
		}
	}

	#header_icon_sma{
		text-align: center;
	}
	#header_info{
		display: inline;
		float:left;
		font-size: 1em;
		margin-top: 0;
		margin-left: 0;
		margin-right: 0;
	}
	#header_tel{
		width: 80%;
		float: left;
	}

/* hamburgerここから */
    .menu_bar{
	    display: none;
    }
    .menu_bar_nav{
	    display:none;
    }
	/* input非表示 */
	.input-hidden{
		display: none;
	}
		/* label */
	.hamburger_switch{
		cursor: pointer;
		position: absolute;
		right: 1%;
		top: 0;
		z-index: 9999;
		width: 4em;
		height: 4em;
	}
	/* メニュー展開時にハンバーガーアイコンを固定 */
	#hamburger1:checked ~ .hamburger_switch{
		position: fixed;
	}
	/* 円を用いたハンバーガーデザイン */
		/* 外側の円 */
	.hamburger_switch:before{
		content: "MENU";
		color:#02b3b7;
		text-align: center;
		position: absolute;
		width: 3.5em;
		height:1.5em;
		top: 55%;
		left: 50%;
		transform: translate(-50%, -50%);
		border: 2px dotted #02b3b7; /* 外側の円（枠線）の色 */
	}
		/* 上下の線 */
	.hamburger_switch_circle:before, .hamburger_switch_circle:after{
		content: "";
		position: absolute;
		width: 20px;
		top: 50%;
		left: 50%;
		transition: .3s;
	}

	/* アイコン･アニメーション */
	#hamburger1:checked ~ .hamburger_switch .hamburger_switch_circle{
		height: 25px;
		border-radius: 50%;
	}
	#hamburger1:checked ~ .hamburger_switch .hamburger_switch_circle:before{
		width: 0;
	}
	#hamburger1:checked ~ .hamburger_switch .hamburger_switch_circle:after{
		width: 0;
	}
		/* 真ん中の×印 */
	.hamburger_switch:after{
		content: "";
		font-size: 0px;
		position: absolute;
		color: #fff; /* ハンバーガーの"×"マークの色 */
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
		transition: .2s;
	}
	#hamburger1:checked ~ .hamburger_switch:after{
		font-size: 25px;
	}
	/* メニューエリア */
	.hamburger_menuwrap{
		position: fixed;
		height: 100%;
		background: #fafafa; /* メニューエリアの背景色 */
		padding: 5em 3% 2em;
		z-index: 9998;
		transition: .3s;
		overflow-y: scroll; /* メニュー内容が多い場合に縦スクロール */
		top: 0;
		left: 100%;
		width: 70%;
	}
	/* メニューリスト */
	.hamburger_menulist{
		margin-right: 3%;
		padding-left: 5% !important; /* !important不要な場合あり */
		list-style: none;
	}
	.hamburger_menulist li{
		list-style: none;
	}

	.hamburger_menulist li a{
		text-decoration: none;
		color: #333; /* メニューエリアの文字色 */
		display: block;
	}
		/* 円を用いたメニューリスト */
	.hamburger_menulist_circle li{
		border: 1px solid;
		margin-bottom: 5px;
		border-radius: 2em;
	}
	.hamburger_menulist_circle li a{
		padding: .5em 2.5em .5em 1em;
		position: relative;
	}
	.hamburger_menulist_circle a:before{
		content: "";
		position: absolute;
		width: 1.5em;
		height: 1.5em;
		background: #02b3b7; /* メニューリスト矢印背景（円）の色 */
		border-radius: 50%;
		top: 50%;
		right: 2.0em;
		transform: translate(0, -50%);
	}
	.hamburger_menulist_circle a:after{
		content: "";
		position: absolute;
		width: 10px;
		height: 10px;
		border: 2.5px solid;
		border-color: #fff #fff transparent transparent; /* メニューリスト矢印の色（#fffのみ変更） */
		top: 50%;
		right: 2.0em;
		transform: translate(-80%, -50%) rotate(45deg);
	}
	/* メニューエリア･アニメーション */
		/* 右から */
	#hamburger1:checked ~ .hamburger_menuwrap{
		left: 30%;
	}
		/* コンテンツカバー */
	#hamburger1:checked ~ .hamburger_cover{
		position: fixed;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		z-index: 9997;
		background: rgba(3,3,3,.5);
		display: block;
	}
	/* ハンバーガーメニューここまで */


	/* アイコン */
	.top_pic{
		width:100%;
	  }

      .flow_intro{
        display: block;
    }
    .flow_intro h2{
        display: block;
        margin-top:3.0em;
        text-align: center;
        padding: 0.5em 0;/*上下の余白*/
        border-top: solid 3px #02b3b7;/*上線*/
        border-bottom: solid 3px #02b3b7;/*下線*/
    }
	@media screen and (max-width:550px) {
		.flow_intro h2{
			display: block;
        	margin-top:1.0em;
        	text-align: center;
        	padding: 0.5em 0;/*上下の余白*/
        	border-top: solid 3px #02b3b7;/*上線*/
        	border-bottom: solid 3px #02b3b7;/*下線*/
		}		
	}
    .flow_intro p{
        text-align: center;
    }
    #parg_margin{
        display: block;
        margin-top:2.5em;
    } 
    #futsuflow_btn{
        margin-bottom: 0.5em;
        margin-left: 0.5em;
    }
    #futsuflow_btn a{
        display: block;
        text-decoration: none;
        font-weight: bold;
        color: #962329;
    }
    #futsuflow_descrition p{
        display: block;
    }
    .futsu_flow h2{
        text-align: center;
        border-bottom: solid 3px #962329 ;
    }
    #kflow_btn a{
        display: block;
        text-decoration: none;
        font-weight: bold;
        color: #962329;
    }
    #kflow_btn{
        margin-bottom: 0.5em;
        margin-left: 0.5em;
    }
    .flow_flex_containar{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-around;
    }
    .flow_flex_containar p{
        margin: 5px;
    }
	.flow_flex_containar2{
		margin-block-start:2em;
	}
    .flow_pic{
        border-bottom:dotted 3px black;
        width: 100%;
    }
}
#yellow_maker{
	background-color: yellow;
}


/* フッター */
.footer{
	width: 100%;
	margin-top:3em;
	display: block;
}
.footer p{
	text-align: center;
	font-weight: bold;
	border-top: solid 2px black;
}