html{
	scroll-behavior: smooth;
}
h1{
	margin:0 auto 20px auto;
	padding:0 auto;
}
h1 img{
	width:1024px;
}
h2{
	font-weight: bold;
	font-size:2.4rem;
	color:#333;
	text-align: left;
	margin-bottom:20px;
}
.oc-instruction{
	width:1024px;
	margin:50px auto 100px auto;
}

section{
	margin:0 auto 40px;
}
section:last-of-type{
	margin:0 auto 0;
}
.mb20{
	margin-bottom:20px;
}
.marker{
	font-weight:bold;
	background: linear-gradient(transparent 70%, #ffff66 70%);
}
.b-txt{
	font-weight:bold;
}

.mokuji{
	margin:40px auto 0 auto;
	padding:20px 40px;
	border: #043d82 dashed 1px;
	width: fit-content;
}
.mokuji a{
	color:#333;
}
.mokuji h4{
    color:#043d82;
	font-weight:bold;
	text-align: center;
	font-size: 20px;
	margin-bottom:20px;

  }
.mokuji ul{
    list-style: none; 
    padding: 0;
    margin: 0 auto;
    color: #333333; 
  }
 .mokuji li {
    position: relative;
    padding-left: 1.2em; 
    margin-bottom: 12px;
    line-height: 1.5;
    font-size: 14px;
  }
.mokuji li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.5em; 
    width: 0.6em; 
    height: 0.6em; 
    background-color: #043d82; 
  }
h2{
	color:#043d82;
	font-size:24px;
	font-weight:bold;
	padding:0 0 5px 0;
	margin:0 0 20px 0;
	border-bottom:#043d82 solid 1px;
}
h3{
	color:#333;
	font-size:20px;
	font-weight:bold;
	margin:30px 0 20px 0;
}
.basic-p{
	margin:0 0 20px 0;
}
.dashed-box{
	border: #043d82 dashed 1px;
	padding:20px;
	/*width: fit-content;*/
	margin:0 auto 40px auto;
}
.dashed-box h4{
	background: #c5cbe2;
	color:#333;
	font-weight:bold;
	font-size:18px;
	padding:5px 10px;
	border-radius: 16px;
	line-height: 1em;
	width: fit-content;
	margin:0 auto 20px auto;
}
.dashed-box h5 {
	font-size: 16px; 
	font-weight: bold;
	color: #333; 
	margin: 0 0 10px 0; 
	display: flex;
	align-items: center; 
}

.dashed-box h5::before {
	content: "\2605"; /* ★のUnicode指定 */
	color: #7987bc;
	margin-right: 4px; 
}
.txt-batsu{
	font-size:16px;
	margin-right:5px;
	font-weight:lighter;
}
.seifuku{
	background: url(../img/seifuku.png) no-repeat top 40px right 20px;
	background-size: 278px;
}
.txt-maru{
	margin-right:5px;
	font-weight:lighter;
}
.shifuku{
	background: url(../img/shifuku.png) no-repeat top 40px right 20px;
	background-size: 278px;
}
table,th,td{
	border-collapse: collapse;
	border:#CCC solid 1px;
	border-spacing: 0;
}
.oc-instruction-table{
	line-height:1.5em;
	margin:0 0 20px 0 ;
}
.oc-instruction-table th, .oc-instruction-table td{
	padding:10px 20px;
}
.headline{
	background: #ebf1fb;
	text-align: center;
	font-weight:bold;
}
.note{
	background:#ebf1fb;
	padding:20px;
	margin:40px 0;
}
.note h5{
	color:#043d82;
	font-weight:bold;
	font-size:14px;
	margin-top:0;
	margin-bottom:10px;
	display: block;
	border-radius: 10px;
	background: #FFF;
	padding:5px 4px;
	width: fit-content;
	border: #043d82 solid 1px;
}
.step{
	color:#FFF;
	font-weight:bold;
	font-size:14px;
	margin-bottom:10px;
	border-radius: 10px;
	background: #043d82;
	padding:5px 8px;
	width: fit-content;
	margin-right:5px;
}
.divider {
	display: flex;
	align-items: center; 
	width: 100%; 
	margin: 20px 0; 
}
.divider-line {
	flex-grow: 1; /* 左右の余白をこの線で均等に埋める */
	height: 1px;
	background-color: #ccc; 
}
.divider-triangle {
	box-sizing: border-box;
	width: 16px; /* 三角形のサイズ */
	height: 16px;
	border-bottom: 1px solid #ccc; 
	border-right: 1px solid #ccc;  
	transform: rotate(45deg); /* 45度回転させて下向きの「V」字にする */
	flex-shrink: 0;
	margin: 0 3px; /* 回転によって広がる幅のズレを埋めて、左右の線と隙間なく繋げる調整値 */
}
.light-color-txt{
	color:#7987bc;
}
.h4-white-bg{
	color:#043d82;
	font-weight:bold;
	margin-bottom:10px;
	display: block;
	border-radius: 10px;
	background: #FFF;
	padding:5px 12px;
	width: fit-content;
	border: #043d82 solid 1px;
}
.step-img1,.step-img2,.step-img3{
	display: block;
	float:right;
	margin-left:40px;
	margin-bottom:20px;
}
.step-img1{
	width:26%;
}
.step-img2{
	width:26%;
}
.step-img3{
	width:22%;
}
.square{
	font-size:1.4rem;
	margin-right:5px;
}
.track{
	background: url(../img/track.png) no-repeat top 40px right 20px;
	background-size: 278px;
}
.b-txt-list{
	list-style-type: none;
	margin:0;
	padding:0;
}
.b-txt-list li{
	font-weight:bold;
	margin-bottom:5px;
}
.lighter-txt{
	font-weight:lighter;
}
.bus{
	background: url(../img/bus.png) no-repeat top 40px right 20px;
	background-size: 278px;
	
}
.prof{
	background: #ebf1fb;
	padding:0 16px 16px 16px;
	margin:40px 0 0 0;
}
.prof h4{
	background: #043d82;
	display: block;
	margin:0 auto 0 auto;
	color:#FFF;
	font-weight:bold;
	font-size:16px;
	text-align: center;
	padding:5px;
	width:6em;
}
.prof-txt{
	text-align: center;
	line-height: 2em;
	margin:0 auto 10px auto;
	padding:0 auto; 
	font-size:15px;
}
.prof-txt a{
	text-decoration: none;
}

.logo-img img,.logo-img source{
	width:20%;
	margin-bottom:5px;
}
.campaign-banner{
	margin:20px auto;
}
.campaign-banner img{
	display: block;
	margin:0 auto;
}


