@charset "utf-8";
.oc2026 .title {
background: url(/common/files//295/oc_2025-01.png) no-repeat center top;
background-size:  cover;
}

.oc2026 .title h1 {
text-align: center;
padding: 50px 0 100px;
}

.oc2026 .sanka {
/*background: url(/common/files//295/oc-03.png) no-repeat center top;*/
text-align: center;
padding-bottom: 60px;
height:80px;
}

.oc2026 .sanka .vi {
position: relative;
top: -80px;
left: 0;
right: 0;
margin: 0 auto;
}

.oc2026 .sanka .vi  img {
width: 140px;
height: auto;
}
.oc2026 .sanka h2 {
font-size: 36px;
font-weight: bold;
margin-top: -90px;
}

.oc2026 .sanka p {
font-size: 20px;
font-weight: bold;
margin-top: 0;
}

.oc2026 .order {
background: url(/common/files//295/oc-04.png) no-repeat center bottom;
background-size: contain;
padding-bottom: 460px;
}

.oc2026 .order .campusImabari,
.oc2026 .order .campusOkayama {
padding-top: 20px;
}

.oc2026 .order .campusImabari {
background: url(/common/files//295/back-01.png) no-repeat 30% 0,
url(/common/files//295/back-03.png) no-repeat 80% 120px;
}

.oc2026 .order .campusOkayama {
background: url(/common/files//295/back-02.png) no-repeat 90% 0;
}

.oc2026 .order h2 {
position: relative;
color: #FFF;
}

.oc2026 .order h2 img {
width: 120px;
height: auto;
position: relative;
z-index: 5;
vertical-align: -40px;
top: 0;
left: -10px;
}

.oc2026 .order .campusImabari h2 span {
position: relative;
background-color: #13BDCC;
padding-left: 120px;
padding-right: 20px;
display: block;
width: 100%;
border-radius: 0 8px 8px 0;
top: -80px;
left: 0;
}

.oc2026 .order .campusOkayama h2 span {
position: relative;
padding-left: 120px;
padding-right: 20px;
display: block;
width: 100%;
border-radius: 0 8px 8px 0;
top: -80px;
left: 0;
background-color: #ACCD04;
}

.oc2026 .order ul {
display: flex;
flex-wrap: wrap;
margin-bottom: 40px;
}

.oc2026 .order ul li {
width: 32%;
margin: 0 0 20px;
text-align: center;
font-size: 30px;
font-weight: bold;
line-height: 1.5;
padding: 6px;
display:flex;
 border-bottom: 2px solid #EEE;
 border-radius: 8px 8px 0 0;
}

.oc2026 .order ul li:nth-of-type(3n-1) {
margin: 0 2% 20px;
}

.oc2026 .order .campusImabari ul li {
 background: linear-gradient(to bottom, #13BDCC, #FFF);
}

.oc2026 .order .campusOkayama ul li {
 background: linear-gradient(to bottom, #ACCD04, #FFF);
}

.oc2026 .order .campusOkayama dl,
.oc2026 .order .campusImabari dl {
margin: -20px 0 20px;
display: flex;
font-size: 18px;
font-weight: bold;
align-items: start;
}

.oc2026 .order .campusOkayama dl dt {
 width: 140px;
 text-align: center;
 background-color: #ACCD04;
 color: #FFF;
 margin-right: 20px;
}

.oc2026 .order .ready {
font-size: 20px;/*14*/
color: #AAA;
margin-top: -6px;
}

.oc2026 .order .campusImabari dl dt {
 width: 140px;
 text-align: center;
 background-color: #13BDCC;
 color: #FFF;
 margin-right: 20px;
}

.oc2026 .order .campusImabari .soudankai li {
 width: 48%;
 margin: 0 1% 20px;
 font-size: 26px;
}

.oc2026 .order .campusImabari .soudankai li.nolink {
padding: 10px;
}

.oc2026 .order .campusImabari .soudankai li.nolink div {
background-color: #FFF;
padding-top: 42px;
padding-bottom: 10px;
}

.oc2026 .order .campusImabari .soudankai li p.title {
background-image: none;
display: block;
width: 240px;
margin: -36px auto 20px;
padding: 8px;
background-color: #13BDCC;
color: #FFF;
border-radius: 8px 8px 0 0;
}

.oc2026 .order .campusImabari .soudankai li img {
width: 40px;
height: auto;
vertical-align: -9px;
margin-right: 4px;
}

.oc2026 .order ul li a,
.oc2026 .order ul li.nolink {
display: block;
width: 100%;
position: relative;
color: #000;
padding: 10px;
background-color: #FFF;
text-decoration: none;
 border-radius: 8px 8px 0 0;
}

.oc2026 .order ul li.nolink {
width: 32%;
}

.oc2026 .order ul li.nolink2 {
width: 32%;
}

.oc2026 .order ul li a span,
.oc2026 .order ul li.nolink a span,
.oc2026 .order ul li.nolink2 span {
font-size: 14px;
background-color: #B8CACC;
border-radius: 100vh;
padding: 0 4px 1px;
margin-left: 2px;
}

.oc2026 .order ul li a p,
.oc2026 .order ul li.nolink p,
.oc2026 .order ul li.nolink2 p {
font-size: 20px;
margin: 4px 0 10px;
}

.oc2026 .order ul li a p.jikan,
.oc2026 .order ul li.nolink p.jikan,
.oc2026 .order ul li.nolink2 p.jikan {
font-size: 18px;
margin: 4px 0 10px;
}

.oc2026 .order ul li.nolink2 div {
display: block;
width: 100%;
position: relative;
color: #000;
padding: 10px;
background-color: #FFF;
text-decoration: none;
 border-radius: 8px 8px 0 0;
}

.oc2026 .order ul li a .sp,
.oc2026 .order ul li.nolink2 .sp {
display: none;
}

.oc2026 .order ul li a .jikan2,
.oc2026 .order ul li.nolink .jikan2 {
font-size: 18px;
background-color: transparent;
padding:0;
display: block;
margin-bottom: 8px;
}

.oc2026 .order ul li a div {
position: absolute;
width: 100%;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
}

.oc2026 .order ul li.nolink .title {
position: relative;
z-index: 10;
}

.oc2026 .order ul li.nolink div {
position: relative;
top: -35px;
}

.oc2026 .order ul li.close {
background-color: #838383;
display: block;
height: 140px;
position: relative;
}

.oc2026 .order ul li.close div {
position: absolute;
width: 100%;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
}

.oc2026 .order ul li:before {
display: none;
}

.oc2026 .order .order_imabari ul li a {
background-color: #13BDCC;
}

.oc2026 .order .order_okayama ul li a {
background-color: #ACCD04;
}

.oc2026 .order ul li .place {
display: block;
font-size: 14px;
}

.oc2026 .order ul li .day {
font-size: 14px;
margin-left: 4px;
}

.oc2026 .order a:hover {
opacity: .8;
}

.oc2026 .order ul li .text {
display: block;
font-size: 14px;
}

.oc2026 .ioList {
background-color: #FEF3ED;
padding: 120px 0 0;
}

.oc2026 .ioList .imabariList {
background-color: #13BDCC;
}

.oc2026 .ioList .imabariList .ct {
position: relative;
top: -120px;
background: url(/common/files//295/oc-07.png) #FFF no-repeat center top;
padding: 30px;
}

.oc2026 .ioList .imabariList .ct .photo {
width: 46%;
padding: 20px 0 0;
}

.oc2026 .ioList .imabariList .ct .text {
padding: 20px 0;
font-weight: bold;
}

.oc2026 .ioList .imabariList .ct .text h2 {
font-size: 36px;
font-weight: bold;
color: #13BDCC;
margin-bottom: 4px;
}

.oc2026 .ioList .imabariList .ct .text dl {
display: flex;
align-items: start;
flex-wrap: wrap;
}

.oc2026 .ioList .imabariList .ct .text dl dt {
display: inline-block;
margin-right: 10px;
background-color: #13BDCC;
color: #FFF;
padding: 4px;
width: 120px;
}

.oc2026 .ioList .imabariList .ct .text dl dd {
margin-bottom: 0;
padding: 4px;
font-size: 1.1em;
width: calc( 100% - 120px);
}

.oc2026 .ioList .imabariList .ct .text h3 {
color: #13BDCC;
border-bottom: 3px solid #13BDCC;
line-height: 1.2;
padding-bottom: 4px;
}

.oc2026 .ioList .imabariList .ct .text p {
line-height: 1.4;
margin-right: 30px;
}

.oc2026 .ioList .btns {
margin: 0;
padding: 0 0 60px;
display: flex;
justify-content: space-between;
}

.oc2026 .ioList .btns li {
width: 48%;
margin: -60px 0 0;
padding: 0;
}

.oc2026 .ioList .btns li:before {
display: none;
}

.oc2026 .ioList .btns li a {
display: block;
padding: 12px 0;
text-align: center;
border: 2px solid #FFF;
font-size: 18px;
color: #FFF;
text-decoration: none;
background: url(/common/files//295/oc-11.png) no-repeat right bottom;
}

.oc2026 .ioList .btns li a img {
margin-right: 16px;
}

.oc2026 .ioList .okayamaList {
background-color: #ACCD04;
}

.oc2026 .ioList .okayamaList .ct {
position: relative;
top: -120px;
display: flex;
background: url(/common/files//295/oc-14.png) #FFF no-repeat center top;
justify-content: space-between;
padding-top: 10px;
align-items: start;
}

.oc2026 .ioList .okayamaList .ct .photo {
width: 46%;
padding: 20px 0 0;
}

.oc2026 .ioList .okayamaList .ct .text {
width: 50%;
padding: 20px 0;
font-weight: bold;
}

.oc2026 .ioList .okayamaList .ct .text h2 {
font-size: 36px;
font-weight: bold;
color: #ACCD04;
margin-bottom: 4px;
}

.oc2026 .ioList .okayamaList .ct .text dl {
display: flex;
align-items: start;
}

.oc2026 .ioList .okayamaList .ct .text dl dt {
display: inline-block;
margin-right: 10px;
background-color: #ACCD04;
color: #FFF;
padding: 4px;
}

.oc2026 .ioList .okayamaList .ct .text dl dd {
margin-bottom: 0;
padding: 4px;
font-size: 1.1em;
}

.oc2026 .ioList .okayamaList .ct .text dl dd span {
font-size: 15px;
display: block;
}

.oc2026 .ioList .okayamaList .ct .text h3 {
color: #9FC003;
border-bottom: 3px solid #ACCD04;
line-height: 1.2;
padding-bottom: 4px;
}

.oc2026 .ioList .okayamaList .ct .text p {
line-height: 1.4;
margin-right: 30px;
}

.oc2026 #gookayama.ioList {
padding-top: 200px;
}

.oc2026 .ocinfo {
background-color: #F44C74;
padding: 30px 0;
}

.oc2026 .ocinfo ul {
margin: 0;
padding: 0;
display: flex;
justify-content: space-between;
}

.oc2026 .ocinfo ul li {
width: 48%;
margin: 0;
padding: 0;
}

.oc2026 .ocinfo ul li:before {
display: none;
}

.wakuwaku {
display: flex;
flex-direction: column;
text-align: center;
width: 100%;
padding: 20px 0 0;
}

.wakuwaku img {
width: 340px;
height: auto;
}

.oc2026 .order .campusImabari .soudankai li .soudanbtn {
margin-bottom: 0;
justify-content:center;
}

.oc2026 .order .campusImabari .soudankai li .soudanbtn li {
font-size: 16px;
background: none;
background-color: #F44B74;
border-radius: 8px;
width: 52%;
margin: 0 2% 20px;
}

.oc2026 .order .campusImabari .soudankai li .soudanbtn li a {
background-color: transparent;
color: #FFF;
}

.obtn {
width: 200px;
display: block;
margin: 0 auto !important;
padding: 4px 10px;
background-color: #F44B74;
text-decoration: none;
text-align: center;
color: #FFF;
font-size: 16px !important;
border-radius: 8px;
}

.oc2026 .order .campusImabari .soudankai hr {
display: block;
border: none;
border-bottom: 1px dashed #CCC;
width: 90%;
margin: 0 auto 10px;
}

.orderBtn a {
display: block;
width: 300px;
padding: 8px;
margin: 30px auto 40px;
border: 2px solid #13BDCC;
background-color: #13BDCC;
color: #FFF;
border-radius: 100vh;
text-align: center;
text-decoration: none;
box-shadow: 3px 3px 0 #CCC;
}

.orderBtn a:hover {
background-color: #FFF;
color: #13BDCC;
}

.orderBtn2 a {
display: block;
width: 300px;
padding: 8px;
margin: 30px auto 40px;
border: 2px solid #13BDCC;
background-color: #FFF;
color: #13BDCC;
border-radius: 100vh;
text-align: center;
text-decoration: none;
box-shadow: 3px 3px 0 #CCC;
}

.orderBtn2 a:hover {
background-color: #13BDCC;
color: #FFF;
}

.oc2026 .ioList .imabariList .ct .text h4 {
background-color: #D4F3F6;
}


@media (max-width: 991px){

.oc2026 .title h1 {
margin: 0 10px;
padding: 80px 0 70px;
}

.oc2026 .order {
display: block;
padding-bottom: 200px;
}

.oc2026 .order .campusImabari, .oc2026 .order .campusOkayama {
width: 100%;
}

.oc2026 .order ul li {
width: 48%;
margin: 0 1% 20px;
}

.oc2026 .order ul li:nth-of-type(3n-1) {
margin: 0 1% 20px;
}

.oc2026 .ioList .imabariList .ct .text dl,
.oc2026 .ioList .okayamaList .ct .text dl {
display: block;
}

.oc2026 .ioList .imabariList .ct .text h2,
.oc2026 .ioList .okayamaList .ct .text h2 {
font-size: 26px;
}

.oc2026 .ioList .imabariList .ct .text h3 ,
.oc2026 .ioList .okayamaList .ct .text h3 {
font-size: 22px;
}

.obtn {
width: 100%;
}

.oc2026 .order ul li.nolink2 {
width: 48%;
}

.oc2026 .order ul li.nolink2 .sp {
display: block;
}

}

@media (max-width: 580px){

.oc2026 .title {
background: url(/common/files//295/oc_2025-01.png) #FEF3DC no-repeat center 0;
background-size: contain;
}

.oc2026 .sanka {
background: url(/common/files//295/oc-03.png) no-repeat center top;
background-size: contain;
}

.oc2026 .sanka .vi {
top: -70px;
}

.oc2026 .sanka .vi img {
width: 98px;
height: auto;
}

.oc2026 .order ul li {
font-size: 20px;
}

.oc2026 .order ul li a p,
.oc2026 .order ul li.nolink2 p {
font-size: 18px;
}

.oc2026 .sanka h2 {
font-size: 30px;
margin-top: -20px;
}

.oc2026 .ioList .imabariList .ct,
.oc2026 .ioList .okayamaList .ct {
display: block;
}

.oc2026 .ioList .imabariList .ct .photo,
.oc2026 .ioList .okayamaList .ct .photo {
width: 100%;
}

.oc2026 .ioList .imabariList .ct .text,
.oc2026 .ioList .okayamaList .ct .text {
width: 96%;
margin: 0 auto;
}

.oc2026 .ioList .imabariList .ct .text h2,
.oc2026 .ioList .okayamaList .ct .text h2 {
margin-bottom: 10px;
}

.oc2026 .ioList .imabariList .ct .text p,
.oc2026 .ioList .okayamaList .ct .text p {
margin-right: 0;
}

.oc2026 .ioList .imabariList .ct .text p img,
.oc2026 .ioList .okayamaList .ct .text p img {
display: block;
margin: 0 auto 
}

.oc2026 .ioList .btns {
display: block;
margin-top: -60px;
}

.oc2026 .ioList .btns li {
width: 100%;
margin: 0 0 10px;
}

.oc2026 .ocinfo ul {
display: block;
}

.oc2026 .ocinfo ul li {
width: 100%;
margin-bottom: 10px;
}
.wakuwaku img {
width: 220px;
height: auto;
}
.oc2026 .order .order_okayama {
width: 90%;
}

.oc2026 .order .campusOkayama dl, .oc2026 .order .campusImabari dl {
display: block;
}

.oc2026 .order .campusImabari .soudankai {
display: block;
}

.oc2026 .order .campusImabari .soudankai li {
width: 100%;
margin: 0 0 40px;
font-size: 20px;
}

.oc2026 .order ul li a .sp {
display: block;
}
.oc2026 .ioList .imabariList .ct .text dl dd {
width: 100%;
}

}