body .rn div#dBWrapper .headerBeing {
    font-weight: bold;
    color: #496;
    text-align: center;
    font-size: 2em;
    margin-bottom: 8px;
}
body .rn div#dBWrapper .headerEnd {
    font-weight: bold;
    color: black;
    text-align: center;
    font-size: 2em;
    margin-top: 24px;
    margin-bottom: 8px;
}

body .rn div#dBWrapper .plan {
    margin-bottom: 8px;
    padding: 8px;
    border: 1px solid #ccc;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-flow: row wrap;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

body .rn div#dBWrapper .plan dt {
    width:160px;
}

body .rn div#dBWrapper .plan dt img {
    width: 160px;
    height: 160px;
} 

body .rn div#dBWrapper .plan dd {
    padding-left:8px;
  }
body .rn div#dBWrapper .planEnd {
    background-color: #ccc;
    opacity: 0.5;
}

body .rn div#dBWrapper dd .planTitle {
    font-size: 1.3em;
    margin: 0;
    padding: 4px 0;
    text-decoration: none;
    color: #00337f;
    font-weight: bold;
}
body .rn div#dBWrapper .planTitle:hover {
    text-decoration: underline;
}

body .rn div#dBWrapper .plan p {
    margin: 0;
    font-size: 1.1rem;
/*    font-size: 0.75rem;*/
}

body .rn div#dBWrapper .priorMark {
    background-color: #f17602;
    color: white;
    padding: 8px;
    position: absolute;
    top: 0;
    left: 0;
}

body .rn div#dBWrapper div.date {
    margin: 8px 0;
    padding: 4px 8px;
    background-color: #eeebe8;
}

body .rn div#dBWrapper .enableDate {
    font-weight: bold;
}

body .rn div#dBWrapper .contentBox {
    border: 1px solid #ccc;
    padding: 20px;
}

body .rn div#dBWrapper div.content img {
    max-width: 100%;
    height: auto;
}

body .rn div#dBWrapper .btn2Order {
    display: block;
    font-size: 20px;
    padding: 8px;
    margin: 8px;
    text-align: center;
    border-radius: 4px;
    color: white;
    background-color: #22aa22;
    text-decoration: none;
    border-bottom: 2px solid #226622;
}
body .rn div#dBWrapper .btn2Order:hover {
    background-color: #44bb44;
    border-bottom-color: #447744;
    text-decoration: none;
    color: white;
}
body .rn div#dBWrapper .btn2Order:visited {
    color: white;
}

body .rn div#dBWrapper form:not(.freeInput) em {
    color:#fff;
    background-color: #f00;
    padding: 0.3em 1em;
    margin: 4px;
    border-radius: 1em;
    display:block;
    font-size: 1.4rem;
    font-weight: bold;
}
body .rn div#dBWrapper form .freeInput dd em{
    color:#fff;
    background-color: #f00;
    padding: 0.3em 1em;
    margin: 4px;
    border-radius: 1em;
    display:block;
    font-size: 1.4rem;
    font-weight: bold;
}

/* 申し込み用カレンダー */
body .rn div#dBWrapper div.orderCal {
    width: 280px;
    min-height: 256px;
    margin: 8px 4px;
    float: left;
    max-width: 100%;
}
body .rn div#dBWrapper div.orderCal table {
    width: 100%;
    border-collapse: collapse;
}
body .rn div#dBWrapper div.orderCal .header {
    width: 100%;
    text-align: center;
    border: 1px solid #ddd;
    padding: 4px;
    background-color: #ddd;
}
body .rn div#dBWrapper div.orderCal .sun {
    color: red;
}
body .rn div#dBWrapper div.orderCal .sat {
    color: blue;
}
body .rn div#dBWrapper div.orderCal th {
    text-align: center;
    border: 1px solid #ddd;
    border-bottom-width: 2px;
    padding: 4px;
}
body .rn div#dBWrapper div.orderCal td {
    text-align: center;
    border: 1px solid #ccc;
}
body .rn div#dBWrapper div.orderCal td a {
    display: block;
    padding: 8px;
    text-decoration: none;
    font-weight: bold;
    color: black;
}
body .rn div#dBWrapper div.orderCal .selected a {
    color: white;
    background-color: #22aa22;
}

body .rn div#dBWrapper ul.legend {
    /*float: right;*/
    margin: 8px;
    clear: both;
    text-align: right;
}
body .rn div#dBWrapper .legend li {
    display: inline-block;
    list-style-type: none;
    font-weight: bold;
    padding: 4px 8px;
    margin-bottom: 8px;
    border: 1px solid #ddd;
}

body .rn div#dBWrapper .orderItem .available {
    background-color: #cff;
}
body .rn div#dBWrapper .orderItem .few {
    background-color: #ffc;
}
body .rn div#dBWrapper .orderItem .full {
    background-color: #fcf;
}
body .rn div#dBWrapper .orderItem .finished {
    background-color: #eee;
}

body .rn div#dBWrapper .orderItem .limit {
    background-color: #ccc;
}

body .rn div#dBWrapper .orderCalCep {float:left;}

body .rn div#dBWrapper .orderItem {
    padding: 8px;
}

body .rn div#dBWrapper .orderItem dt {
    font-weight: bold;
    font-size: 1.6rem;
}
body .rn div#dBWrapper .orderItem dd {
    margin: 8px 0;
    font-size: 1.4rem;
}
body .rn div#dBWrapper .orderItem dd label {
    font-size: 1.4rem;
} 
body .rn div#dBWrapper .orderItem dd select, 
body .rn div#dBWrapper .orderItem dd input {
    font-size: 1.4rem;
}

body .rn div#dBWrapper .freeInput dt {
    font-weight: normal;
}

body .rn div#dBWrapper .freeInput textarea {
    padding: 4px;
}

/* 絞り込み検索 */
body .rn div#dBWrapper .refineForm {
    border: 1px solid #ccc;
    background-color: #eeebe8;
    padding: 8px;
    margin: 16px 0;
}
body .rn div#dBWrapper .refineForm .title {
    font-size: 1.2em;
    font-weight: bold;
    margin: 4px;
}
body .rn div#dBWrapper .refineForm .item {
    margin: 4px;
}
body .rn div#dBWrapper .refineForm .item input {
    margin: 4px;
}

body .rn div#dBWrapper .stipulation {
    padding: 8px;
    margin: 8px 0;
    background-color: #eeebe8;
    text-align: left;
}
body .rn div#dBWrapper .stipulation .title {
    padding: 4px;
    font-weight: bold;
    font-size: 1.1em;
    color: red;
}
body .rn div#dBWrapper .stipulation .check {
    font-weight: bold;
    font-size: 1.2em;
}
body .rn div#dBWrapper .stipulation span {
    padding-left: 40px;
}

body .rn div#dBWrapper .hide {
    display: none;
}

body .rn div#dBWrapper .pageControl {
    margin: 8px 0;
    text-align: right;
}
body .rn div#dBWrapper .pageControl .prev, .pageControl .next {
    text-decoration: none;
    border: 1px solid #ccc;
    padding: 8px 16px;
    color: #000;
    background-color: #ddd;
}
body .rn div#dBWrapper .pageControl .prev:hover, .pageControl .next:hover {
    opacity: 0.7;
}

body .rn div#dBWrapper ol#participantList {
    list-style: none;
    counter-reset: listNumber;
}
body .rn div#dBWrapper ol#participantList li:before {
    counter-increment: listNumber;
    content: counter(listNumber);
    display: inline-block;
    background: #92847a;
    width: 1.5em;
    height: 1.5em;
    border-radius: 50%;
    color: #fff;
    text-align: center;
    line-height: 1.5;
}

body .rn div#dBWrapper select {
    max-width: 100%;
}

body .rn div#dBWrapper p.annotation {
    color: red;
    margin: 4px;
}

body .rn div#dBWrapper ol#participantList {
    list-style: none;
    counter-reset: listNumber;
}
body .rn div#dBWrapper ol#participantList li:before {
    counter-increment: listNumber;
    content: counter(listNumber);
    display: inline-block;
    background: #92847a;
    width: 1.5em;
    height: 1.5em;
    border-radius: 50%;
    color: #fff;
    text-align: center;
    line-height: 1.5;
}

body .rn div#dBWrapper ul.columnForm3 {
    margin: 0;
    padding: 0;
}
body .rn div#dBWrapper ul.columnForm3 li {
    margin: 8px auto;
    list-style: none;
}
body .rn div#dBWrapper ul.columnForm3 li .column1 {
    width: 120px;
    display: inline-block;
    vertical-align: middle;
    font-weight: bold;
}
body .rn div#dBWrapper ul.columnForm3 li .column2 {
    max-width: 120px;
    display: inline-block;
    vertical-align: middle;
    margin-left: 8px;
}
body .rn div#dBWrapper ul.columnForm3 li .column2 input {
    max-width: 120px;
    box-sizing: border-box;
}
body .rn div#dBWrapper ul.columnForm3 li .column3 {
    max-width: 320px;
    display: inline-block;
    vertical-align: top;
    margin-left: 8px;
}

body .rn div#dBWrapper #REQUIRED_QUESTION ul {
    display: block;
    list-style-type: none;
    -webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    -webkit-padding-start: 40px;    
}

/* モーダルダイアログ */
#modal-content {
	width: 50% ;
	margin: 0 ;
	padding: 10px 20px ;
	border: 2px solid #aaa ;
	background: #fff ;
	position: fixed ;
	display: none ;
	z-index: 2 ;
}
  
#modal-overlay {
	z-index: 1 ;
	display: none ;
	position: fixed ;
	top: 0 ;
	left: 0 ;
	width: 100% ;
	height: 120% ;
	background-color: rgba( 0,0,0, 0.75 ) ;
}
/*車載器番号入力用*/
body .rn div#dBWrapper .orderItem dd input.onboard_input {
    width: 10%;
}
body .rn div#dBWrapper .orderItem dd input.onboard_input[name="onboard_middle"] {
    width: 15%;
}
/*特定区間割引用*/
.specific_discount {
    width: 50%;
}
.specific_discount select {
    width: 100%;
}
.specific_discount select:disabled {
    color: #000;
    font-weight: bold;
    opacity: 1;
}
.specific_discount　select optgroup{
    
    }
body .rn div#dBWrapper .specific_discount div:nth-child(2) {
    height: 60px;
    background-image: url(../images/section.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    margin: 10px 0;
}
/*
.tour_contents {
    display:inline-block;
    width:280px;
    margin:0 0 20px 20px;
    font-size:0.9em;
    vertical-align: top;
}
.tour_contents a{font-weight:normal;}
.tour_contents .imgLeft{width:100px; float:left;}
.tour_contents .imgRight{width:100px; float:right;}
.tour_contents div.imgLeft, .tour_contents div.imgRight{max-height:100px; overflow:hidden;}
.tour_contents .imgLeft img, .tour_contents .imgRight img{width:100px;}
.tour_contents .txtLeft{width:200px; float:left; margin:0 5px;}
.tour_contents .txtRight{width:160px; float:right; margin:0 5px;}
.tour_contents .dateDisp{margin:0 0 5px 0; text-align:right; color:#666;}
*/
body .rn div#dBWrapper .commentTag {
    display: inline-block;
    padding: 2px 4px;
    color: #fff;
    background-color: #f17602;
    font-size: 80%;
    border-radius: 2px;
}
/*
@media (max-width: 768px) {
    .plan dt {
        float: none; 
    }
    .plan dt img {
        display: block;
        margin: auto;
    }

    .plan dd {
        width: auto;
        margin-left: auto; 
        position: static; 
        float: none; 
    }

    .planTitle {
        text-align: center;
        max-width: none; 
    }

    div.date {
        width: auto; 
    }
}

@media (max-width: 678px) {
    div.orderCal {
        width: 100%;
        height: auto;
        margin: 8px 0;
        float: none;
    }
}
*/
@media print, screen and (min-width: 768px) {
    body .rn div#dBWrapper .plan dd {
		width: calc(100% - 176px);
    }
}
@media print, screen and (max-width: 767px) {
    body .rn div#dBWrapper .plan dd {
              width: 95%;
    } 
    /*車載器番号入力用*/
    body .rn div#dBWrapper .orderItem dd input.onboard_input {
        width: 20%;
    }
    body .rn div#dBWrapper .orderItem dd input.onboard_input[name="onboard_middle"] {
        width: 30%;
    }
}