body {font-family: 'Roboto', sans-serif !important; background:#ffffff; position:relative; }

ul, li, ul li, table, lable, p, span, dl, dt, dd, table, tr, td {margin: 0px; padding: 0px;}
* {margin: 0px; padding: 0px;  font-style: normal}
a:hover, a:focus {text-decoration: none !important;}
img {border: none;}
.mt5 {margin-top: 5px !important;}
.mt7 {margin-top: 7px !important;}
.mt10 {margin-top: 10px !important;}
.mt15 {margin-top: 15px !important;}
.mt20 {margin-top: 20px !important;}
.mt30 {margin-top: 30px !important;}
.mt40 {margin-top: 40px !important;} 
.mt50 {margin-top: 50px !important;}
.mt60 {margin-top: 60px !important;}
.mb5 {margin-bottom: 5px !important;}
.mb10 {margin-bottom: 10px !important;}
.mb15 {margin-bottom: 15px !important;}
.mb20 {margin-bottom: 20px !important;}
.mb30 {margin-bottom: 30px !important;}
.mb40 {margin-bottom: 40px !important;}
.mb50 {margin-bottom: 50px !important;}
.mb60 {margin-bottom: 60px !important;}
.ml5 {margin-left: 5px !important;}
.ml10 {margin-left: 10px !important;}
.ml15 {margin-left: 15px !important;}
.ml20 {margin-left: 20px !important;}
.ml30 {margin-left: 30px !important;}
.ml40 {margin-left: 40px !important;}
.ml50 {margin-left: 50px !important;}
.ml60 {margin-left: 60px !important;}

.padding0 {margin-left: -5px !important; margin-right: -5px !important;}
.padding0>div {padding-left: 5px !important; padding-right: 5px !important;}

.ul-coomon{width:100%; float:left;padding-left:20px;}
.ul-coomon li{float:left; width:100%; line-height: 30px;}
ul,
ol{padding-left: 20px; margin-bottom: 10px; display: block;}


.box-bouter{width: 100%; display: flex; flex-direction: column; margin-bottom: 30px; padding-bottom: 30px; border-bottom: 2px dotted #f00;}
.box-bouter .box{width: 100%; display: flex; flex-direction: column; align-items:flex-start;}
.box-bouter .box h2{display: flex; margin-bottom: 20px;}
.box-bouter .box p{display: flex; margin-bottom: 10px;}
.box-bouter .box ul{ margin-bottom: 10px; padding-left: 20px;}
.box-bouter .box .btn-panel{display: flex; flex-wrap:wrap;}
.box-bouter .box .btn-panel button{padding: 5px 20px; margin-bottom:10px; font-size: 16px; margin-right: 10px;}
.box-bouter .box .id-box{width: 100%; display: flex; flex-direction: column; border: 1px solid #ccc; padding: 15px;}
.red{color:red;}
.green{color:green;}
.blue{color:blue;}
.yellow{color:yellow;}
.pink{color:pink;}

.red_bg{background:red;}
.green_bg{background:green;}
.blue_bg{background:blue;}
.yellow_bg{background:yellow;}
.pink_bg{background:pink;}
.b{font-weight:bold;}
.b-semi{font-weight:600;}


.common-form{width:100%; float: left; border: 1px solid #000; padding: 20px; margin-bottom:10px;}
.common-form input[type="submit"]{padding: 5px 20px; font-size: 16px; margin-right: 10px;}

/* chepter53 */
.box .box-common {width:100%; padding: 15px; border: 1px solid #000; }
.box .box-common h3{margin-top: 0px;}
.box .main-outer {width: 500px; background: #a786e9; margin-bottom: 20px; position: relative;}
.box .outer {background: #e9aa86; }
.box .inner {background: #f66767; }
.box .inner .div_0{padding: 20px; width: 50px; height: 80px; border: 1px solid #000; background: #c7c5c5; display: inline-block;}


#chepter68 .scroll-box{width:500px; height:300px; float:left; padding:15px; overflow:auto;  background:#f66767; }
#chepter68 .scroll-box .scroll-box-inner{width:600px; float:left;}