@charset "UTF-8";
/*!
 *  season youkaimura-oekaki
 */

@import url('https://fonts.googleapis.com/css2?family=Ms+Madi&family=Noto+Sans+JP:wght@100;400;700&family=RocknRoll+One&display=swap');


body {
    font-size: 12pt;
}

#main {
	font-family: 'Noto Sans JP', sans-serif;
}


a:link {
    color: #212529;
}
a:visited {
    color: #212529;
}
a:hover {
    color: #ffe11a;
}
a:active {
    color: #ffe11a;
}

h1 {
    margin: 50px 0 30px 0;
    font-size: 280%;
    font-weight: bold;
}
h2 {
    margin: 50px 0 30px 0;
    text-align: left;
    font-size: 350%;
    font-weight: 100;
}
h3 {
    margin: 0 0 40px 0;
    text-align: left;
    color: #000;
    font-weight: bold;
    font-size: 200%;
    line-height: 1.5;
}
h4 {
    margin: 30px 0 10px 0;
    text-align: left;
    font-weight: bold;
    font-size: 130%;
}
h5 {
    margin: 20px 0 10px 0;
    text-align: left;
    font-weight: bold;
    font-size: 120%;
}
small {
  font-size: 0.8em;
}


.btn {
    border-radius: 0.3rem;
    line-height: 1.2;
    padding: 0.5rem 1rem;
}
.btn-op {
    color: #fff !important;
    background-color: #bc0300;
    border-color: #bc0300;
}
.btn-op:hover {
    color: #174495 !important;
    background-color: #fff;
    border-color: #bc0300;
    transition: 0.5s;
}
.navbar-toggler:focus {
  text-decoration: none;
  outline: 0;
  box-shadow: none !important;
}

.card {
    border-color: rgba(0,0,0,0.1);
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}
.card-body {
    padding: 1rem 1.5rem;
}
.card-title {
    color: #174495;
    text-align: center;
    font-size: 110%;
    font-weight: bold;
    padding: 0 0 0.8rem 0;
    margin: 0 0 0.8rem 0;
    border-bottom: dashed 2px #174495;
}
.card-title-only {
    color: #000;
    text-align: center;
    font-size: 110%;
    font-weight: bold;
    padding: 0;
    margin: 0;
}
.r-panel {
    padding: 40px 25px 25px 25px;
    background: rgba(255,255,255,0.9);
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    border-radius: 10px;
}
.r-panel-flat {
    padding: 40px 5px;
    background: rgba(255,255,255,0.9);
    border-radius: 10px;
}
.panel-a, .panel-b{
	padding: 1.75rem;
}
.bc-w {
    background-color: #fff;
}

p span.textbold {
    font-weight: bold;
}
section ol li.dot::before {
    content: "・";
	padding: 0;
}

/**
 *  メインビジュアル
 */

div#mainvisualtop {
    padding: 0;
}
div#mainvisual {
    position: relative;
    z-index: 20;
    height: 400px;
	max-width: 100%;
    background-image: url('/stuff/img/season/youkaimura-oekaki/main_lg_youkaimura.jpg');
	background-size: cover;
	background-position: center;
	image-rendering: -webkit-optimize-contrast;
}


@media (min-width: 1399.98px) {
}
@media (max-width: 1199.98px) {
		div#mainvisual {
	    background-image: url('/stuff/img/season/youkaimura-oekaki/main_md_youkaimura.jpg');
	    background-position: center;
	    }
}
@media (max-width: 991.98px) {
}
@media (max-width: 767.98px) {
}
@media (max-width: 575.98px) {
	    div#mainvisualimg{
		background-image: url('/stuff/img/season/youkaimura-oekaki/main_xs_youkaimura_title.png');
		background-repeat: no-repeat;
		background-size: contain;
		width: 20rem;
	}
	    div#mainvisual {
	    background-image: url('/stuff/img/season/youkaimura-oekaki/main_xs_youkaimura.jpg');
	    background-position: center;
	    }
}
@media screen and (max-width: 374.98px) {
	div#mainvisualimg{
		width: 18rem;
	}
}

    div#mainvisual > div {
        height: 400px;
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
		position: relative;
    }
    /* 文章載せる場合の例 */
    div#mainvisual h1 {
    position: absolute;
	z-index: 50;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
	margin: auto;
	white-space: nowrap;
    }

    div#mainvisual img {
    position: absolute;
    z-index: 40;
    top: 10%;
    left: 10%;
    transform: translate(-10%, -10%);
    max-width: 22rem;
    }

    div#mainvisualimg {
    position: absolute;
    z-index: 60;
    top: 10%;
    left: 50%; transform: translateX(-50%);
    }

main section {
    margin: 0;
    padding: 80px 0;
}

#main-logo {
    position: absolute;
    z-index: 40;
    top: 15px;
    left: 8%;
}
.top-copy {
    position: absolute;
    display: inline-block;
    background: rgba(0,0,0,0.4);
    padding: 15px 30px;
    color: #fff;
    font-weight: bold;
    font-size: 200%;
    bottom: 10%;
    right: 0%;
}

section#catch {
    position: relative;
    z-index: 30;
    margin-top: -100px;
}
    section#catch a.top-navi01,section#catch a.top-navi02,section#catch a.top-navi03,section#catch a.top-navi04 {
        display: block;
        padding: 1.75rem 1rem;
        text-align: center;
        text-decoration: none;
        border-radius: 15px;
        box-shadow: 0px 0px 8px #fff;
        position: relative;
    }

    section#catch a.top-navi01 {
        background: #e83522;
        color: #fff;
    }
    section#catch a.top-navi02 {
        background: #8ec31f;
        color: #fff;
    }
    section#catch a.top-navi03 {
        background: #4f86c5;
        color: #fff;
    }
    section#catch a.top-navi04 {
        background: #fdd000;
        color: #000;
    }

    section#catch a.top-navi01 em,section#catch a.top-navi02 em,section#catch a.top-navi03 em,section#catch a.top-navi04 em {
        font-style: normal;
        font-weight: bold;
        font-size: 140%;
    }

    section#catch h1 {
        margin: 50px 0 30px 0;
    	font-size: 180%;
    	font-weight: bold;
    }

    section#catch span.label {
        position: absolute;
        width: 5.0rem;
        color: #ffffff;
        font-size: 1rem;
        font-weight: bold;
        background: #e39801;
        /*padding: 0.2rem 1.0rem;*/
        border-radius: 15px;
    }

    section#catch span.label-left-top {
        left: 0px;
        top: 0px;
    }


section#feature {
	    margin-top: -300px;
	    background-color: #F6F3EA;
}

    section#feature div.feature-inner{
	    margin-top: 200px;
    }

    section#feature h2 {
	    margin: 0;
        font-size: 190%;
        font-weight: bold;
	}
    section#feature div.feature_contents{
	    padding: 1.0rem 0.5rem 0;
    }
    section#feature div.feature_contents p.title{
	    padding: 1.0rem 0;
        text-align: center;
        font-weight: bold;
        font-size: 120%;
		color: #dc494f;
    }
    section#feature div.feature_contents p.sentence{
        text-align: left;
        font-size: 100%;
    }
    section#feature div.feature_contents p span.textsmall{
		display: inline-block;
		padding-top: 0.75rem;
        font-size: 0.8rem;
    }


section#venue {
	    background-color: #eae3d0;
}
    section#venue h2 {
	    margin: 0;
        font-size: 190%;
        font-weight: bold;
    }
    section#venue h4 {
        margin: 1.0rem 0 10px 0;
    }
   
    section#venue p span.textsmall {
        font-size: 0.8rem;
    }
    section#venue img {
	    padding: 1.0rem 0 0 ;
	    margin: auto;
    }
    section#venue div.textmiddle{
	    font-size: 0.875rem;
	    padding-left: 3.0rem;
    }

section#package {
	background-color: #F6F3EA;
}
    section#package h2 {
        margin: 0 0 30px 0;
        font-size: 190%;
        font-weight: bold;
    }
    /*section#package span.under {
    border-bottom:3px solid #8ec3ae;
    padding-bottom: 0.125rem;
    }*/

    section#package h3 {
	    margin: 60px 0 10px 0;
        text-align: center;
        font-weight: bold;
        font-size: 180%;
	    text-shadow:
		    0 0.03em 0.03em #8ec3ae,
		    0 0.03em 0.03em #000,
		    0 0.03em 0.03em #FBE9E7;
    }

    section#package div.package_contents{
	    padding: 1.0rem 0 0;
    }
    section#package div.package_contents p.title{
	    padding: 1.0rem 0;
        text-align: center;
        font-weight: bold;
        font-size: 120%;
    }
    section#package div.package_contents p.sentence{
	    padding-left: 1.0rem;
        text-align: left;
        font-size: 100%;
    }
    section#package div.package_contents p.textsmall{
        display: inline-block;
        font-size: 0.8rem;
		padding-top: 0.75rem;
		padding-left: 1.0rem;
    }

    section#package span.box {
        display: inline-block;
        text-align: center;
        padding: 0.5em 1em;
        margin: 3rem auto 0;
        font-weight: bold;
        background: #FFF;
        border: solid 2px #000;
        border-radius: 10px;
    }
    section#package span.box p {
        margin: 0; 
        padding: 0;
    }


section#series {
	margin-top: -20px;
	background-color: #f9c485;
}

section#series h2 {
	    margin: 0;
        font-size: 190%;
        font-weight: bold;
		text-align: center;
    }


    section#feature div.series_contents{
	    padding: 1.0rem 1.0rem 0;
    }
    section#series .series-inner-side1 {
		padding-bottom: 1.0rem;
}
    section#series .series-inner-side2 {
}
    section#series .panel-a .img02, section#series .panel-b .img02{
		width: 70%;
}
/*    section#series img{
		margin: auto;
		width: 75%;
    }*/


/* contact_section */
.contact_section {
	background-color: #f9f9f7;
}
.contact_section .h2_title {
	margin-bottom: 2.0rem;
	text-align: center; 
}
.contact_section .h2_title h2 {
	display: inline-block;
	padding: 0.25rem 2.0rem;
	border-radius: 2.5rem;
	font-weight: bold; 
}
.contact_section .h2_title h2.color3 {
	background: #fab42d;
	color: #404040; 
 }
.contact_section a:visited{
    color: #404040;
    text-decoration: none;
}


/* company_section */
.company_section {
	padding: 5.0rem 0 10.0rem;
	background-color: #fff;
}
.company_section .h2_title {
	margin-bottom: 2.0rem;
	text-align: center; 
}
.company_section .h2_title h2 {
	display: inline-block;
	padding: 0.25rem 2.0rem;
	border-radius: 2.5rem;
	font-weight: bold; 
}
.contact_section .h2_title h2.company {
	background: #fab42d;
	color: #404040; 
}

/* pagetop_section */
	.pagetop_section a {
    		color: #fff;
		}
	.pagetop_section a:hover {
    		color: #404040;
		}

/**
 *  レスポンシブ調整用
 */
@media (max-width: 1399.98px) {
}
@media (max-width: 1199.98px) {
.panel-a, .panel-b{
	padding: 1.75rem 0;
}
.panel-a .img01, .panel-b .img01{
	padding: 1.5rem;
}
.panel-a .img02, .panel-b .img02{
	padding: 1.5rem 0;
}
}
@media (max-width: 991.98px) {
/*    section#series img{
		width: 100%;
    }*/
    div#mainvisual img {
    position: absolute;
    z-index: 40;
    top: 10%;
    left: 10%;
    transform: translate(-10%, -10%);
    max-width: 18rem;
    }
.panel-a .img01,.panel-b .img01{
	padding: 1.5rem;
}
.panel-a .img02, .panel-b .img02{
	padding: 1.5rem 1.5rem 1.5rem 0;
}
}


@media (max-width: 767.98px) {

.contact_section .h2_title h2 {
        font-size: 1.125rem; 
	} 
.company_section .h2_title h2 {
        font-size: 1.125rem; 
	}
    div#mainvisual img {
    position: absolute;
    z-index: 40;
    top: 10%;
    left: 10%;
    transform: translate(-10%, -10%);
    max-width: 14rem;
    }
}


@media (max-width: 575.98px) {

section#catch a.top-navi01,section#catch a.top-navi02 {
	padding: 2.5rem 0.25rem;
}
section#catch a.top-navi03,section#catch a.top-navi04 {
	padding: 1.75rem 0.25rem;
}

section#catch a.top-navi01 em,section#catch a.top-navi02 em,section#catch a.top-navi03 em,section#catch a.top-navi04 em {
	font-style: normal;
	font-weight: bold;
	font-size: 100%;
}
.contact_section .h2_title h2 {
	font-size: 1.25rem;
	border-radius: 2.5rem;
}
.company_section .h2_title h2 {
	font-size: 1.25rem;
	border-radius: 2.5rem;
}
    div#mainvisual img {
    position: absolute;
    z-index: 40;
    top: 10%;
    left: 10%;
    transform: translate(-10%, -10%);
    max-width: 12rem;
    }
.r-panel-flat {
    padding: 40px 0 25px 0;
}
.panel-a, .panel-b{
	padding: 1.0rem 0.25rem 0;
}
section#feature h2,section#venue h2,section#package h2,section#series h2 {
	text-align: center;
	font-size: 150%;
}
section#feature div.feature_contents{
	padding: 1.0rem 0.25rem 0;
    }
section#feature div.series_contents{
	padding: 1.0rem 0.25rem 0;
    }
}

@media (max-width: 767.98px) {
section#catch a.top-navi01,section#catch a.top-navi02 {
	padding: 2.5rem 0.25rem;
}
section#catch a.top-navi03,section#catch a.top-navi04 {
	padding: 1.75rem 0.25rem;
}
section#venue div.textmiddle{
	font-size: 0.8rem;
	margin-top: 1.75rem;
	padding: 0.75rem;
	border: solid 0.025rem #404040;
    }
}

@media (max-width: 333.98px) {
section#series .h3_title h3 {
	padding: 0.5rem 2.5rem;
    }
}

@media (min-width: 992px) {
section#series .series-inner-side1, section#series .series-inner-side2 {
	padding-right: 4.0rem;
}
section#series .panel-a{
	padding: 2.0rem 1.75rem 0;
}
section#series .panel-b{
	padding: 0 1.75rem;
}
section#series .panel-a .img01, section#series .panel-b .img01{
	width: 90%;
}
section#series .panel-a .img02, section#series .panel-b .img02{
	width: 40%;
}
}
@media (min-width: 1200px) {
section#series .series-inner-side1 {
		padding-bottom: 2.0rem;
}
section#series .panel-a{
	padding: 2.0rem 1.75rem 0;
}
section#series .panel-b{
	padding: 2.0rem 1.75rem 0;
}
section#series .panel-a .img01, section#series .panel-b .img01{
	width: 100%;
}
section#series .panel-a .img02, section#series .panel-b .img02{
	width: 70%;
}
}

@media screen and (min-width: 992px){
  .spbr{
    display: none;
  }
}
@media screen and (max-width: 762px){
  .pcbr{
    display: none;
  }
}