@charset "utf-8";
/* CSS Document */

/*----------------------
	デフォルトスタイル
-----------------------*/
body,p,h1,h2,h3,h4,h5,h6,
span,small,strong,
div,ul,li,
figure,img,
header,footer,section{
    margin:0;
    padding:0;
	border:none;
	outline:none;
	font-size:1rem;
}



header,footer,section{display:block;}


body{
	font-family: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
	background-color: #FFFFFF;
	color:#000000;
	font-size:1rem;
}



/*【角丸】*/
img.corner01{
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
}

img.max {
	max-width:100%;
	min-width:10px;
	height:auto;
}





/* リンク色 */
a{
	color:#3399cc;
	text-decoration:none;
}

/*訪問後のリンク*/
a:visited {
    color:#409EB5;
    text-decoration:none;
}



/* フェイドアップ */

.fade-up {
  transition: opacity 1s;
  -moz-transition: opacity 1s;
  -webkit-transition: opacity 1s;
  -o-transition: opacity 1s;
  transition: transform 1s;
  -moz-transition: transform 1s;
  -webkit-transition: transform 1s;
  -o-transition: transform 1s;
margin:10px 0 0 0; /* ページ内アンカーリンクのスクロール調整 */

}


/* アンカー　ページ内リンクの位置調整 */

div.anc {
  display: block;
  height: 50px;
  margin-top: -50px;
  content: "";
}





/*■横幅で表示変更
--------------------*/

.PC{display:none;}
 
@media screen and (min-width:640px){
.SP{display:none;}
.PC{display:inherit;}
}





/*▼画面幅設定 */


#max1000 {
max-width: 1000px;
margin: 0 auto;
text-align: left;
}

@media (max-width: 640px) {#max1000 {padding:0px 5px;}}



/* ▼SSIトップ  *

.half{
display: flex;
width:50%;
}
@media (max-width: 640px) {.half{display: grid;}}


.half2{
border:1px solid #cccccc;
padding:10px;
margin:0 3px 0 0;
width:49%;
border-radius: 10px;
}

@media (max-width: 640px) {.half2{width: 98%;}}


.sample{
background:#0000ff;
color:#fff;
border:3px solid #000;
}






/* ■診療科の最上段画像に被る大見出し */

div.title01{
position: absolute;
font-size:50px;
color:#000;
font-weight:bold;
opacity: 0.9; /* 不透明度を最大に */
top:100px;
left:50px;
z-index:5;
}

div.title02{
position: absolute;
font-size:60px;
color:#fff;
opacity: 0.5; /* 不透明度を最大に */
top:80px;
left:70px;
z-index:4;
}

span.title03{
position: absolute;
background:#fff;
opacity: 0.7; /* 不透明度を最大に */
z-index:3;
top:150px;
left:40px;
width:500px;
height:10px;
}



@media (max-width: 640px) {
.title01{display:none;}
.title02{display:none;}
.title03{display:none;}
}

 
 


/* フローティングボタン共通 */

.fbutton{
    position: fixed;
    font-size: 0.8rem;
    font-weight:bold;
    z-index:999;
}

.fbutton a{
    background: #409EB5;
    text-decoration: none;
    color: #FFFFFF;
    border: 2px #FFFFFF solid;
    width: 80px;
    padding: 5px 0;
    text-align: center;
    display: block;
    border-radius: 5px;
}


.fbutton a:hover {
    text-decoration: none;
    background: #70D2F0;
    border: 2px #FFFFFF solid;
    color: #ffffff;
}



/*■上に戻るボタン　*/
.fbutton-1 {bottom: 10px; right: 10px;}

/*■トップページへ戻るボタン　*/
.fbutton-2 {bottom: 10px; left: 10px;}

/*■前のページへ戻るボタン　*/
.fbutton-3 {bottom: 46px; left: 10px;}



.clear-both {clear:both;}


div.none{display:none;}

.fs07{font-size:0.7rem;}
.fs08{font-size:0.8rem;}
.fs09{font-size:0.9rem;}
.fs11{font-size:1.1rem;}
.fs12{font-size:1.2rem;}
.fs15{font-size:1.5rem;}
.fs20{font-size:2.0rem;}
.fs25{font-size:2.5rem;}

.right{text-align:right;}
.left{text-align:left;}

.blue{color:#3399cc;}
.blue2{color:#004080;}
.red{color:#FF0000;}
.orange{color:orange;}
.bold{font-weight:bold;}

.und01{
padding:0 0 3px 0;
border-bottom:1px dotted #3399cc;
}








h1{
    color: #333;
    font-size: 1.5rem;
    margin: 0px 0px 10px;
    border-bottom: 1px #333 solid;
    padding: 10px;
    background: #fff;
}

















/*■携帯用アコーディオンメニュー
--------------------*/

div.sp_top{
    height: 50px;
    width: 100%;
    background-color: #ffffff;
    opacity: 0.8; /* 不透明度を最大に */
    position: fixed;
    z-index: 1000;
    border-bottom:1px solid #70d2f0;
}







/* ■装飾見出し */


.h01 {
    position: relative;
    padding: 0.8rem 0;
    margin-bottom: 0.2rem;
    overflow: hidden;
    color: #333;
    font-weight: bold;
    font-size: 1.2rem;
}

.h01:before,
.h01:after {
    position: absolute;
    width: 100%;
    bottom: 0;
    content: '';
}

.h01:before {
    border-bottom: 5px solid #3399CC;
}

.h01:after {
    border-bottom: 5px solid #CCCCCC;
}





.h02 {
	position: relative;
	padding-top: 10px;
	font-size: 1.2rem;
	border-bottom: 2px solid #004080;
	border-right: 2px solid #004080;
	margin:0 0 30px 0;
	background: linear-gradient(to right, #fff, #3399CC);
	border-radius:0 10px 10px 0;
}

.h02 span {
	background-color: transparent;
	position: relative;
	z-index: 2;
	font-size:1.2rem;
	font-weight:bold;
	border-left:3px solid #fff;
    border-image: linear-gradient(to right bottom,#cccccc,#666666) 1;
	padding:10px;
	color:#000000;
	margin:0 0 0 5px;
}

.h02::before {
	content: attr(data-en);
	position: absolute;
	top: -20px;
	left: 50px;
	color: rgba(5,62,98,0.1);
	font-size: 3rem;
	text-transform: none;
	z-index: 1;
}



.h03 {
  position: relative;
  color: #3399cc;
  font-size: 16px;
  padding: 10px 0;
  text-align: center;
  margin:  15px 0;
}
.h03:before {
  content: "";
  position: absolute;
  top: -8px;
  left: 50%;
  width: 150px;
  height: 58px;
  border-radius: 50%;
  border: 2px solid #3399CC;
  border-left-color: transparent;
  border-right-color: transparent;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}


/* ▼ssi top */

/* ■最上段 */

#pc_head{
position: fixed;
top:0;
z-index:1001;
width:100%;
background:#fff;
opacity: 0.95; /* 不透明度を最大に */
border-bottom:1px solid #ccc;
}


.container {
display: flex;
justify-content: space-between;

}

.block01 {
            width: 230px;
            height: 50px;
            margin: 0px;
			display: flex;
            align-items: flex-end;
            padding: 0 5px;
justify-content: flex-start;  /* 左寄せ */
        }


.block02 {
            width: 230px;
            height: 50px;
            margin: 0px;
			display: flex;
            align-items: flex-end;
            padding: 0 5px;
flex-direction: column;
justify-content: flex-end;    /* 右寄せ */
margin-right: 100px;          /* 右端から100pxの間を空ける */
        }

@media (max-width: 800px) {.block02 {display:none;}}


.block03 {
            width: 40px;
            height: 40px;
            margin: 0px;
			display: flex;
            align-items: flex-end;
flex-direction: column;
justify-content: flex-end;    /* 右寄せ */
margin-top:5px;
margin-right: 95px;          /* 右端から100pxの間を空ける */
        }

@media (min-width: 800px) {.block03 {display:none;}}






.topbox-04{ /* 電話番号 */
	font-size:30px;
	width:100%;
	color:#000;
	background:#fff;
	text-align:center;
	vertical-align: middle;
	}



.topbox-05{ /* 営業時間 */
	font-size:10px;
	width:100%;
	color:#fff;
	background:#333333;
	text-align:center;
	margin:0 0 2px 0;
}












/* ▼PC版ナビメニュー */

button.modal01 {
  display: block;
  position: fixed;
	top:0;
	right:0;
    padding:0;
    margin:0;
    background:none;
    border:0;
    font-size:0;
    line-height:0;
    overflow:visible;
    cursor:pointer;
  z-index: 1002;
}




/* メニューボタンのスタイル */
.menu-button {
  display: block;
  position: fixed;
  top: 5px;
  right: 10px;
  cursor: pointer;
  background:#333333;
  height: 40px;
  width: 40px;
  z-index: 1002;
}

/* メニューバーのスタイル */
.bar {
  display: block;
  width: 30px;
  height: 3px;
  margin: 5px 0;
  background-color: #fff;
}

.bar01 {
  margin: 10px 0 0 0;
}




.menu-btn2 { /* 「menu」表示 */
	color:#fff;
	font-size:10px;
    position: fixed;
    top: 5px;
    right: 50px;
    display: flex;
    height: 40px;
    width: 40px;
    justify-content: center;
    align-items: center;
    z-index: 1090;
    background-color: #333333;
}





dialog:modal { /* モーダルウィンドウのカスタマイズ */
	border: 1px solid #000;
	background: #fff;
    border-radius:10px;
	max-width:900px;
	opacity: 1;
}
 
dialog::backdrop { /* 背景となる部分のカスタマイズ */
	background: #000;
	opacity: .9;
}

/* ■■閉じるボタン */

button.close-btn{
width:60%;
border:1px solid #ccc;
background:#ff8000;
color:#fff;
font-size:20px;
    cursor :pointer;
    border-radius:15px;
}









p.menu03{
font-size:1rem;
font-weight:bold;
margin:10px 10px 0 10px;
border-bottom:1px dotted #ccc;
}

p.menu04{
font-size:0.8rem;
margin:0 10px;
}

p.menu05{
font-size:1.2rem;
color:#fff;
font-weight:bold;
background:#004080;
border-left:15px solid #3399cc;
padding:3px 15px;
margin:30px 0 10px;
}




ul.cp_list {
  padding: 5px;
  list-style-type: none;
}


ul.cp_list li {
  position: relative;
  box-sizing: border-box;
  display: block;
  float: left;
  width: 100%;
  padding: 3px 0 3px 30px;
  margin-bottom:5px;
  border-bottom: 1px solid #ccc;
}



@media (min-width: 800px) {
  ul.cp_list li {
  width: 50%;    
  }
}





ul.cp_list a{
color:#3399CC;
}


ul.cp_list li:after,
ul.cp_list li:before{
  position: absolute;
  content:'';
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}
ul.cp_list li:before {
  left: 0;
  width: 14px;
  height: 14px;
  background: rgba(25,118,210, 1);
}
ul.cp_list li:after {
  top: 1em;
  left: 0.5em;
  width: 10px;
  height: 10px;
  background: rgba(25,118,210, 0.5);
}






/* ■■box2個・幅100%縦並び→50%50%横並び */

.box5050-wrap{
  display: flex;
  flex-direction: column; /* デフォルトで縦並び */
}

.box5050-cmn{
width:95%;
margin-bottom:10px;
}

.box5050-1{
display: flex;
align-items: center
}

span.item01{
font-size:1.2rem;
color:#333;
border-top:1px solid #333;
border-bottom:1px solid #333;
padding:10px 10px;
margin:0;
}


span.item02{
font-size:0.7rem;
color:#333;
}





.box5050-2{
margin-left:3px;
margin-bottom:0;
}

@media (min-width: 640px) {
  .box5050-wrap {
    flex-direction: row; /* 横並びに変更 */
    justify-content: space-between;
  }

  .box5050-cmn {
    width: 45%; /* 横並びの際の幅 */
    margin-bottom: 30px; /* 横並び時は余白をなくす */
  }
}


.divbg01{
background:#f8f4e6;
padding:10px;
border-radius:10px;
}



/* ■■box3個・幅100%縦並び→33%+33%+33%横並び */

.box33-wrap{
  display: flex;
  flex-direction: column; /* デフォルトで縦並び */
}

.box33-cmn{
width:90%;
margin-bottom:20px;
background:#f8f4e6;
border-radius: 10px;
padding:10px;
margin-right:auto;
margin-left:auto;

}

.box33-1{
}

.box33-2{
}

.box33-3{
}


@media (min-width: 640px) {
  .box33-wrap {
    flex-direction: row; /* 横並びに変更 */
    justify-content: space-between;
  }

  .box33-cmn {
    width: 31%; /* 横並びの際の幅 */
    margin-bottom: 0; /* 横並び時は余白をなくす */
  }
}



/* ■Pテキスト */

.text01{
	font-size:1rem;
	line-height : 1.4rem;
	margin:0 0 0.7rem 0;
}

.text02{
	font-size:1rem;
	text-indent: 1rem;
	line-height : 1.4rem;
	margin:0 0 0.9rem 0;
}

.text03{
	font-size:1rem;
	color:#004080;
	line-height : 1.4rem;
	margin:0 0 0.7rem 0;
}


.text04{
	font-size:1rem;
	line-height : 2rem;
	margin:0 0 0.7rem 0;
}





p.p01{
font-size:1.2rem;
color:#3399cc;
font-weight:bold;
border-bottom:1px dotted #333;
padding:3px 0;
margin:30px 0 10px;
}

span.span01{
font-size:1.2rem;
color:#004080;
font-weight:bold;
padding:3px 0 ;
margin:30px 0 50px;
}




p.p02{
font-size:1.2rem;
color:#fff;
font-weight:bold;
background:#3399cc;
padding:3px ;
margin:30px 0 10px;
}

p.p03{
font-size:1rem;
color:#3399cc;
border-bottom:1px dotted #333;
padding:3px 0;
margin:30px 0 10px;
}


p.p04{
font-size:1.2rem;
color:#666666;
font-weight:bold;
}


p.p05{
font-size:1.2rem;
color:#004080;
font-weight:bold;
}




/* ▼目次枠線囲み */
.news {
    border: 1px solid #666666;
    color: #666666;
    border-radius: 10px;
    margin: 15px 10px;
    padding: 25px 20px 20px;
    position: relative;
}
.news::before {
    background-color: #fff;
    color: #666666;
    content: "目次";
    font-weight: bold;
    left: 1rem;
    padding: 5px;
    position: absolute;
    top: -1rem;
}





.news li{
list-style:none;
   position: relative;
   padding-left: 20px;
	margin:0 0 15px 30px;
  }
 
.news li:before {
   content: "";
   position: absolute;
   top: .1em;
   left: -3px;
   width: 1rem;
   height: 1rem;
   border-top: 1px solid #fff;
   border-right: 1px solid #fff;
   border-radius: 50%;
   background-color: #004080;
  }
 
.news li:after {
   content: "";
   position: absolute;
   top: .5em;
   left: 1px;
   -webkit-transform: rotate(45deg);
   -ms-transform: rotate(45deg);
   transform: rotate(45deg);
   width: 4px;
   height: 4px;
   border-top: 2px solid #fff;
   border-right: 2px solid #fff;
  }

.news a{
color:#004080;
font-weight:bold;
}





/* ▲枠線囲み */





/* ■リンク装飾 */



.link01{
  font-size:1rem;
  color: #666666;
  padding: 3px 20px;
  display: inline-block;
  background: #ffffff;
  vertical-align: middle;
  border: solid 1px #cfcfcf;
  border-radius: 25px;
 }

.center{text-align:center;}



A.call01{
  font-size:0.9rem;
  line-height:0.9rem;
  color: #000000;
  padding: 1px 15px;
  margin: 0;
  display: inline-block;
  background-image: linear-gradient(white,white,white,#f0f0f0);
  vertical-align: middle;
  border: solid 1px #cfcfcf;
  border-radius: 25px;
}

A.call01:before{
	content:url(/img/call01.png);
}











/* ■table */


/* ■トップページ使用 */


div.topdiv01{
margin:0px;
width:95%;
border:1px solid #ccc;
background:#edf1fa;
color:#333;
padding:10px;
border-radius: 10px;
}

.jouge{
border-top:2px solid #3399cc;
border-bottom:2px solid #3399cc;
  color: #3399cc;
  font-size: 20px;
  padding: 5px 0;
  margin:20px 0;
  }





#topword01{
position: absolute;
width:60%;
top: 110px;
left: 5px;
background:#fff;
opacity: 0.9;
}



@media (min-width: 800px) {
  #topword01 {
width:40%;
top: 200px;
left: 30px;
  }
}






#topword02{
border-left:10px solid #333;
color:#333;
font-size: clamp(18px, 2.9vw, 36px);
padding:0 10px;
margin:10px;
}



#topword05{
font-size:1.5rem;
background:#f8f4e6;
padding:10px;
margin:0
}

#topword03{
font-size:1.5rem;
background:#fff;
padding:10px;
margin:0
}








#topword08 {
	border-left:10px solid #004080;
	color:#004080;
	font-size: clamp(18px, 2.9vw, 36px);
	padding:0 10px;
	margin:60px 0 0 10px;
}


/* ■ドクター */

.dr-wrap{
width:95%;
  display: flex;
  flex-direction: column; /* デフォルトで縦並び */
background:#f8f4e6;
border-radius:10px;
margin-left:auto;
margin-right:auto;
}

@media (min-width: 640px) {
  .dr-wrap {
    flex-direction: row; /* 横並びに変更 */
    justify-content: space-between;
  }

  .dr-cmn {
    width: 40%; /* 横並びの際の幅 */
    margin-bottom: 0; /* 横並び時は余白をなくす */
  }
}

.dr-cmn{
width:80%;
margin-bottom:10px;
}

.dr-01{
    padding:30px;
}

.dr-02{
margin-bottom:0;
    padding:0 20px 10px;
}

@media (min-width: 640px) {.dr-02 {padding:60px 10px 10px;}}


.p-dr {
  font-size:2rem;
  position: relative;
  color: black;
  background: #d0ecff;
  line-height: 1.4;
  padding: 5px;
  margin: 30px 0 0;
  border-radius: 0 5px 5px 5px;
}

.p-dr:after { /*タブ*/
  position: absolute;
  font-family: "Font Awesome 5 Free",'Quicksand','Avenir','Arial',sans-serif;
  background: #004080;
  color: #fff;
  left: 0px;
  bottom: 100%;
  border-radius: 5px 5px 0 0;
  padding: 10px 10px 3px;
  font-size: 16px;
  line-height: 1;
  letter-spacing: 0.05em
}


.p-dr01:after {
  content: '院長・歯科医師';
}

.p-dr02:after {
  content: '副院長・歯科医師';
}

.p-dr03:after {
  content: '矯正専門医・歯科医師';
}


.staff-name01{
color:#004080;
font-weight:bold;
border-bottom:1px solid #004080;
margin:0;
}

div.staff-bg{
border:1px solid #ccc;
padding:20px;
background:#fff;
border-radius:20px;
margin:30px 5px;
}



/* ■休診日他 */


table.table01{
	width:100%;
	margin:auto;
	width:100%;
border-collapse: collapse
}

table.table01 td{
	width:30%;
	font-size:0.9rem;
	border-bottom:1px dotted #ccc;
	padding:5px 0;
}



table.table01 td:nth-child(1) {
	width:20%;
}

table.table01 td:nth-child(2) {
	width:40%;
}






table.table02{
	width:100%;
	width:100%;
	border-collapse: collapse
}

@media (min-width: 640px) {table.table02 {width:50%;}}

table.table02 td{
	text-align:center;
	border:1px solid #cccccc;
	padding:5px 0;
}


.yoyaku01{
color:#fff;
background:#ff0000;
font-size:1.2rem;
font-weight:bold;
padding:5px;
}








/* ■麻酔ページ */

.number01 {
	color:#004080;
	position: relative;
	font-size: 1.5rem;
	margin:0 0 10px 0;
}

.number01::before {
	content: attr(data-number);
	display: block;
	color: #3399CC;
	font-size: 1.5rem;
	margin:10px 0 0 0;
}

.number01::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 200px;
	height: 3px;
	background-color: #3399CC;
}

/* ■スタッフページ */


/* ■小児 */

ul.sealant{
padding:10px;
list-style-type:decimal;
list-style-position:inside;
}


/* ■入れ歯 */

table.price01{
	width:100%;
	margin:auto;
	width:100%;
border-collapse: collapse
}

table.price01 td{
	text-align:center;
	border:1px solid #cccccc;
	padding:5px 0;
}


@media (min-width: 640px) {
  table.price01 {
width:60%;
  }
}


/* ■矯正歯科 */




table.kyousei-price{
	width:100%;
	margin:auto;
	border-collapse: collapse
}

table.kyousei-price td{
		border:1px solid #cccccc;
	padding:5px 3px;
}

table.kyousei-price tr td:nth-child(2) {
	text-align: right;
}

@media (min-width: 640px) {table.kyousei-price {width:60%;}}


<!-- ■faqアコーディオン -->


.accbox {
    margin: 2em 0;
    padding: 0;
    max-width: 100%;
}


.accbox label {
    display: block;
    margin: 0 0 1px 0;
    padding : 10px;
    color :#004080;
    font-weight: nomal;
    background :#F8F4E6;
    cursor :pointer;
    transition: all 0.2s;
}

.accbox label:hover {
    background :#004080;
    color:#ffffff;
}

.accbox input {
    display: none;
}

.accbox .accshow {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.5s;
}

.cssacc:checked + .accshow {
    height: auto;
    padding: 5px;
    background:  rgba(0, 0, 0, 0);
    opacity: 1;
}


p.acckid{
	font-size:0.9rem;
	margin:0 0 10px 0;
	padding:0 10px;
}





/* ■■むし歯　保険で白い歯 */

span.c1234{
background:#3399cc;
color:#fff;
font-weight:bold;
font-size:0.8rem;
border-radius:5px;
padding:3px 15px;
}


div.c1c2{
width:85%;
border:1px solid #ccc;
padding:20px;
border-radius:10px;
margin:10px;
}



div.cadx1{
border:1px solid #ccc;
padding:20px;
background:#fff;
border-radius:20px;
margin:30px 5px;
}




table.table01_cad{
	width:100%;
	margin:auto;
	width:100%;
border-collapse: collapse
}


table.table01_cad th{
	font-size:0.9rem;
	color:#000;
	text-align:center;
	border:1px solid #cccccc;
	padding:5px 0;
}



table.table01_cad td{
	width:30%;
	font-size:0.9rem;
	text-align:center;
	border:1px solid #cccccc;
	padding:5px 0;
}



/* ■■審美 */



.sh01a,.sh01b{float:left; margin:10px 0 0 0;}

.sh01a{
	background:#004080;
	color:#ffffff;
	font-size:1rem;
	border:1px solid #000;
  border-radius:10px 0 0 10px;
padding:0 5px 0 10px;
}


.sh01b{
	background:#ffffff;
	color:#333333;
	font-size:1rem;
	border:1px solid #666666;
  border-radius:0 10px 10px 0;
padding:0 10px 0 5px;
}







/* ■■設備 */

h2.setsubi01{
background:#3399cc;
color:#fff;
border-top:3px solid #ccc;
border-left:3px solid #ccc;
border-right:3px solid #ccc;
font-size:1.2rem;
font-weight:bold;
padding:10px;
margin:10px 10px 0;
border-radius:10px 10px 0 0;
}

div.setsubi01{
border:3px solid #ccc;
background:#edf1fa;
padding:15px;
margin:0 10px 10px;
border-radius:0 0 10px 10px;
}

table.table-setsubi01{
	width:100%;
	border-spacing: 5px 1rem;
}

table.table-setsubi01 td:nth-child(1) {
	vertical-align: top;
	width:25%;
}

table.table-setsubi01 td:nth-child(2) {
	vertical-align: top;
}


@media (min-width: 640px) {
table.table-setsubi01 td:nth-child(1){width:200px;}
}


p.p03-s{
font-size:1rem;
font-weight:bold;
color:#3399cc;
border-bottom:1px solid #ccc;
padding:3px 0;
margin:0 ;
}





/* ■■番号付きリスト */


/* ▼オレンジ四角数字　初期設定 */
ol.ol01 {
  position: relative;
  margin: 0;
  padding: 0 10px 0 6px;
  list-style: none;
  font-weight: bold;
}
ol.ol01 li {
  position: relative;
  margin: 12px 20px 0 24px;
  padding: 0;
  line-height: 1.5;
}

/* ol デザイン */
ol.ol01 {
  counter-reset: li;
}
ol.ol01 > li:before {
  position: absolute;
  font-weight: bold;
  counter-increment: li;
  content: counter(li) "";
  left: -34px;
  top: -1px;
  color: #fff;
  width: 24px;
  height: 24px;
  font-size: 14px;
  text-align: center;
  box-sizing: border-box;
  font-weight: bold;
  line-height: 1;
  background: #ffc33c;
  padding: 6px 0;
}

/* リンクデザイン */
ol.ol01 a {
  text-decoration: none;
  color: #333;
}
ol.ol01 a:hover {
  text-decoration: underline;
}

/* スマホ設定 */
@media screen and (max-width: 768px) {
  ol.ol01 {
    padding: 0 10px 0 20px;
    font-size: 14px;
  }
  ol.ol01 li {
    margin: 6px 20px 0 8px;
    padding: 0;
  }
  ol.ol01 > li:before {
    font-size: 12px;
    left: -30px;
    top: 0px;
    padding: 4px 0;
    width: 20px;
    height: 20px;
  }
}





/* ▼水色四角数字　初期設定 */
ol.ol02 {
  position: relative;
  margin: 0 0 0 5px;
  padding: 0 10px 0 6px;
  list-style: none;
  font-weight: bold;
}
ol.ol02 li {
  position: relative;
  margin: 12px 20px 0 24px;
  padding: 0;
  line-height: 1.5;
}

/* ol デザイン */
ol.ol02 {
  counter-reset: li;
}
ol.ol02 > li:before {
  position: absolute;
  font-weight: bold;
  counter-increment: li;
  content: counter(li) "";
  left: -34px;
  top: -1px;
  color: #fff;
  width: 24px;
  height: 24px;
  font-size: 14px;
  text-align: center;
  box-sizing: border-box;
  font-weight: bold;
  line-height: 1;
  background: #3399cc;
  padding: 6px 0;
}

/* リンクデザイン */
ol.ol02 a {
  text-decoration: none;
  color: #333;
}
ol.ol02 a:hover {
  text-decoration: underline;
}

/* スマホ設定 */
@media screen and (max-width: 768px) {
  ol.ol02 {
    padding: 0 10px 0 20px;
    font-size: 14px;
  }
  ol.ol02 li {
    margin: 6px 20px 0 8px;
    padding: 0;
  }
  ol.ol02 > li:before {
    font-size: 12px;
    left: -30px;
    top: 0px;
    padding: 4px 0;
    width: 20px;
    height: 20px;
  }
}





/*■iOS用、iframeスクロールバー制御用
--------------------*/


.ifrm-container {
      width:100%;
      height:300px;
      border:1px solid #c9c9c9;
      overflow:auto;
      -webkit-overflow-scrolling:touch;
}

.ifrm {
      width:100%;
      height:100%;
      display:block;
      border:none;
}


/*■100％幅、コンテンツ基本テーブル*/
TABLE#table1 {
width: 100%;
align: center;
border: 0px;
}