@charset "utf-8";

@import url("//fonts.googleapis.com/earlyaccess/notosansjp.css");
@import url("//code.jquery.com/ui/jquery-ui-git.css");

/*****************************************************************************
reset 
*****************************************************************************/

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
margin: 0;
padding: 0;
}

address,caption,cite,code,dfn,em,strong,th,var {
font-style: normal;
}

ul,ol {
list-style-type: none;
}

em,strong,th,address {
font-style: normal;
font-weight: normal;
text-align: left;
}

h1,h2,h3,h4,h5,h6 {
font-weight: normal;
font-size: 100%;
}

img,
object,
embed {
border: 0;
vertical-align: top;
}

img {
max-width: 100%;
height: auto;
}

hr {
display: none;
}

table {
border-collapse: collapse;
border-spacing: 0;
font-size: 100%;
}

li {
list-style-type: none;
}

strong {
font-weight: bold;
}

/*****************************************************************************
linkColor 
*****************************************************************************/

a:link {
color: #000000;
text-decoration: none;
}

a:visited {
color: #000000;
text-decoration: none;
}

a:hover,a:active {
text-decoration: underline;
}

/*****************************************************************************
clearfix 
*****************************************************************************/

.cb {
clear: both;
font-size: 1%;
height: 0;
line-height: 0;
}

.clearfix:after {
content: ".";
display: block;
height: 0.1px;
font-size: 0.1em;
line-height: 0; 
clear: both;
visibility: hidden; 
}

.clearfix {
display: inline-block;
}

/* Hide from IE-mac \*/

* html .clearfix { height: 1%; }
.clearfix { display:block; }

/* End hide from IE-mac */

/*****************************************************************************
base
*****************************************************************************/

html {
font-size: 62.5%;
-webkit-text-size-adjust: 100%;
}
body {
background-color: #FFFFFF;
font-family: "Noto Sans JP", sans-serif;
line-height: 1.5;
font-size: 1.5rem;
color: #222222;
overflow-x: hidden;
}

/*****************************************************************************
header 
*****************************************************************************/

.header {
max-width: 1260px;
height: 200px;
margin: 0 auto;
position: relative;
z-index: 99;
}
@media screen and (max-width: 670px) {
.header {
height: 80px;
}
}
.header-logo {
position: absolute;
top: 50%;
left: 15px;
transform: translate(0,-50%);
}
.header-logo img {
width: 180px;
}
@media screen and (max-width: 670px) {
.header-logo img {
width: 100px;
}
}
.header-logo a {
color: #673b20;
display: block;
transition: 0.3s;
}
@media screen and (max-width: 670px) {
.header-logo a {
display: flex;
align-items: center;
}
}
.header-logo a:hover {
text-decoration: none;
opacity: 0.7;
}
.header-logo span {
letter-spacing: 6px;
text-align: center;
font-weight: 700;
font-size: 2.3rem;
display: block;
}
@media screen and (max-width: 670px) {
.header-logo span {
margin-left: 5px;
letter-spacing: 2px;
font-size: 1.6rem;
}
}
.header-logo img {
margin-bottom: 6px;
}
@media screen and (max-width: 670px) {
.header-logo img {
margin-bottom: 0;
}
}
.header-navi {
position: absolute;
right: 15px;
bottom: 40px;
}
@media screen and (max-width: 1200px) {
.header-navi {
width: 100%;
height: 100vh;
background-color: rgba(255,255,255,0.95);
position: absolute;
top: 0;
left: 0;
display: none;
}
}
@media screen and (min-width: 1201px) {
.header-navi {
display: block !important;
}
}
.header-navi ul {
display: flex;
flex-wrap: wrap;
position: relative;
}
@media screen and (max-width: 1200px) {
.header-navi ul {
width: 100%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
}
.header-navi ul:last-child:after {
position: absolute;
bottom: 6px;
right: 0;
content: '';
width: 2px;
height: 20px;
background: #e6e6e6;
}
@media screen and (max-width: 1200px) {
.header-navi ul:last-child:after {
display: none;
}
}
.header-navi li {
width: 110px;
text-align: center;
position: relative;
}
@media screen and (max-width: 1200px) {
.header-navi li {
width: 33.3333%;
margin: 20px 0;
}
}
.header-navi li:after {
position: absolute;
bottom: 6px;
left: 0;
content: '';
width: 2px;
height: 20px;
background: #e6e6e6;
}
@media screen and (max-width: 1200px) {
.header-navi li:after {
display: none;
}
}
.header-navi li a {
color: #666666;
display: block;
position: relative;
transition: 0.3s;
}
.header-navi li a:hover {
text-decoration: none;
color: #673b20;
}
.header-navi li img {
width: 43px;
margin-bottom: 15px;
}
.header-navi li span {
height: 35px;
letter-spacing: 2px;
line-height: 1.3;
font-weight: 400;
display: flex;
align-items: center;
justify-content: center;
}
.header-navi li a:after {
position: absolute;
bottom: -15px;
left: 50%;
content: '';
width: 0;
height: 2px;
background: #673b20;
transition: 0.3s;
}
@media screen and (max-width: 1024px) {
.header-navi li a span:after {
display: none;
}
}
.header-navi li a:hover:after {
width: 100%;
left: 0;
}
@media screen and (max-width: 1024px) {
.header-navi li a:hover:after {
display: none;
}
}
.header-navi li.cr a {
color: #673b20;
}
.header-navi li.cr a:after {
content: '';
position: absolute;
left: 0;
bottom: -15px;
width: 100%;
height: 2px;
background: #673b20;
}
@media screen and (max-width: 1024px) {
.header-navi li.cr a:after {
display: none;
}
}


.sp-button {
position: absolute;
top: 50%;
right: 30px;
height: 50px;
width: 50px;
background: #644121;
border: none;
outline: none;
cursor: pointer;
transition: all 0.3s ease-out;
border-radius: 4px;
display: none;
transform: translate(0,-50%);
}
@media screen and (max-width: 670px) {
.sp-button {
right: 15px;
}
}
.sp-button span {
position: absolute;
display: block;
background: #FFFFFF;
width: 30px;
height: 3px;
left: 10px;
transition: 0.3s;
}
.sp-button span:nth-of-type(1) {
top: 12px;
}
.sp-button span:nth-of-type(2) {
top: 23px;
}
.sp-button span:nth-of-type(3) {
bottom: 12px;
}
@media screen and (max-width: 1200px) {
.sp-button {
display: block;
}
.state-nav-open span:nth-of-type(1) {
transform: rotateZ(45deg) translate(8px,8px);
}
.state-nav-open span:nth-of-type(2) {
opacity: 0;
}
.state-nav-open span:nth-of-type(3) {
transform: rotateZ(-45deg) translate(8px,-8px);
}
}

/*****************************************************************************
visual 
*****************************************************************************/

.home__visual {
height: 650px;
background: url(/youchien/assets/img/home/visual.jpg) no-repeat center center;
background-size: cover;
position: relative;
}
@media screen and (max-width: 900px) {
.home__visual {
height: 500px;
}
}
@media screen and (max-width: 670px) {
.home__visual {
height: 350px;
}
}
.home__visual-title {
width: 100%;
box-sizing: border-box;
padding: 0 15px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
.home__visual-title h2 {
max-width: 970px;
margin: 0 auto;
}
@media screen and (max-width: 1280px) {
.home__visual-title h2 {
max-width: 770px;
}
}
@media screen and (max-width: 1024px) {
.home__visual-title h2 {
max-width: 570px;
}
}

/*****************************************************************************
contents 
*****************************************************************************/

.home__newsItem {
background: #f2f2f2;
}
.home__newsItem-wrapper {
padding: 15px 0;
display: flex;
justify-content: space-between;
align-items: center;
}
@media screen and (max-width: 670px) {
.home__newsItem-wrapper {
display: block;
}
}
.home__newsItem-box {
display: flex;
}
@media screen and (max-width: 670px) {
.home__newsItem-box {
margin-bottom: 10px;
display: block;
}
}
.home__newsItem-box dt {
border-right: 2px solid #b7b7b7;
margin-right: 19px;
padding-right: 19px;
}
@media screen and (max-width: 670px) {
.home__newsItem-box dt {
border-right: none;
margin: 0 0 10px 0;
padding-right: 0;
}
}
.home__newsItem-box dd span {
margin-right: 20px;
}
@media screen and (max-width: 670px) {
.home__newsItem-box dd span {
margin-right: 0;
display: block;
}
}
.home__newsItem-btn {
}
.home__newsItem-btn a {
background: url(/youchien/assets/img/common/arrow01.png) no-repeat right center;
background-size: 16px auto;
padding-right: 22px;
}


.home__messege {
background: url(/youchien/assets/img/home/messege-bg01.png) no-repeat center top;
background-size: 1728px auto;
padding: 240px 0 80px;
}
@media screen and (max-width: 670px) {
.home__messege {
background-size: 864px auto;
padding: 128px 0 40px;
}
}
.home__messege-headline {
margin-bottom: 148px;
text-align: center;
}
@media screen and (max-width: 670px) {
.home__messege-headline {
margin-bottom: 74px;
}
}
.home__messege-headline img {
height: 60px;
}
@media screen and (max-width: 670px) {
.home__messege-headline img {
height: 40px;
}
}
.home__messege-wrapper {
background: url(/youchien/assets/img/home/messege-bg02.png) no-repeat center center;
background-size: 1230px auto;
text-align: center;
}
@media screen and (max-width: 900px) {
.home__messege-wrapper {
background: none;
}
}
.home__messege-wrapper p {
margin-bottom: 2em;
font-weight: 700;
line-height: 1.8;
font-size: 2.0rem;
color: #4f3301;
}
@media screen and (max-width: 670px) {
.home__messege-wrapper p {
margin-bottom: 1em;
font-size: 1.6rem;
}
.home__messege-wrapper p br {
display: none;
}
}
.home__messege-wrapper p:last-child {
margin-bottom: 0;
}


.home__enrichment {
background: url(/youchien/assets/img/home/enrichment-bg01.jpg) no-repeat center center;
background-size: cover;
padding-bottom: 100px;
}
@media screen and (max-width: 670px) {
.home__enrichment {
padding-bottom: 50px;
}
}
.home__enrichment-bg {
background: url(/youchien/assets/img/home/enrichment-bg02.png) no-repeat center top;
background-size: 1910px auto;
padding-top: 236px;
}
@media screen and (max-width: 670px) {
.home__enrichment-bg {
background-size: 955px auto;
padding-top: 120px;
}
}
.home__enrichment-headline {
margin-bottom: 148px;
text-align: center;
}
@media screen and (max-width: 670px) {
.home__enrichment-headline {
margin-bottom: 74px;
}
}
.home__enrichment-headline img {
height: 60px;
}
@media screen and (max-width: 670px) {
.home__enrichment-headline img {
height: 30px;
}
}
.home__enrichment-wrapper {
overflow: hidden;
}
.home__enrichment-area {
margin: 0 -50px 70px;
display: flex;
}
@media screen and (max-width: 1024px) {
.home__enrichment-area {
margin: 0 -25px 70px;
}
}
@media screen and (max-width: 900px) {
.home__enrichment-area {
margin: 0 0 50px;
display: block;
}
}
.home__enrichment-area:last-child {
margin-bottom: 0;
}
.home__enrichment-area .order1 {
order: 1;
}
.home__enrichment-area .order2 {
order: 2;
}
.home__enrichment-img {
width: 50%;
box-sizing: border-box;
padding: 0 50px;
}
@media screen and (max-width: 1024px) {
.home__enrichment-img {
padding: 0 25px;
}
}
@media screen and (max-width: 900px) {
.home__enrichment-img {
width: 100%;
margin-bottom: 15px;
padding: 0;
}
}
.home__enrichment-img img {
box-sizing: border-box;
border: 5px solid #FFFFFF;
}
.home__enrichment-box {
width: 50%;
box-sizing: border-box;
padding: 0 50px;
}
@media screen and (max-width: 1024px) {
.home__enrichment-box {
padding: 0 25px;
}
}
@media screen and (max-width: 900px) {
.home__enrichment-box {
width: 100%;
padding: 0;
}
}
.home__enrichment-title {
margin-bottom: 14px;
font-weight: 700;
font-size: 3.0rem;
color: #efeb7f;
}
@media screen and (max-width: 900px) {
.home__enrichment-title {
display: flex;
align-items: center;
}
}
@media screen and (max-width: 670px) {
.home__enrichment-title {
font-size: 2.0rem;
}
}
.home__enrichment-title span {
margin-bottom: 7px;
line-height: 1;
font-size: 10.0rem;
display: block;
}
@media screen and (max-width: 900px) {
.home__enrichment-title span {
margin-right: 10px;
}
}
@media screen and (max-width: 670px) {
.home__enrichment-title span {
font-size: 5.5rem;
}
}
.home__enrichment-text {
line-height: 1.8;
font-size: 1.6rem;
color: #FFFFFF;
}


.home__curriculum {
background: url(/youchien/assets/img/home/curriculum-bg01.png) no-repeat center top;
background-size: 1730px auto;
padding: 239px 0 90px;
}
@media screen and (max-width: 670px) {
.home__curriculum {
background-size: 865px auto;
padding: 128px 0 50px;
}
}
.home__curriculum-headline {
margin-bottom: 148px;
text-align: center;
}
@media screen and (max-width: 670px) {
.home__curriculum-headline {
margin-bottom: 74px;
}
}
.home__curriculum-headline img {
height: 60px;
}
@media screen and (max-width: 670px) {
.home__curriculum-headline img {
height: 40px;
}
}
.home__curriculum-wrapper01 {
max-width: 580px;
margin: 0 auto 70px;
}
@media screen and (max-width: 670px) {
.home__curriculum-wrapper01 {
margin: 0 auto 35px;
}
}
.home__curriculum-wrapper01-logo {
max-width: 420px;
margin: 0 auto 50px;
}
@media screen and (max-width: 670px) {
.home__curriculum-wrapper01-logo {
max-width: 240px;
margin: 0 auto 25px;
}
}
.home__curriculum-wrapper01-title {
margin-bottom: 30px;
text-align: center;
letter-spacing: 4px;
font-weight: 700;
font-size: 2.5rem;
color: #573100;
}
@media screen and (max-width: 670px) {
.home__curriculum-wrapper01-title {
letter-spacing: 2px;
font-size: 2.0rem;
}
}
.home__curriculum-wrapper01-text {
line-height: 1.8;
font-size: 1.6rem;
}
.home__curriculum-photo .bx-wrapper {
position: relative;
}
.home__curriculum-photo .bx-controls {
width: 100%;
box-sizing: border-box;
position: absolute;
left: 0;
bottom: 200px;
z-index: 99;
}
@media screen and (max-width: 1280px) {
.home__curriculum-photo .bx-controls {
bottom: 120px;
}
}
@media screen and (max-width: 670px) {
.home__curriculum-photo .bx-controls {
bottom: 20px;
}
}
.home__curriculum-photo .bx-pager {
display: flex;
justify-content: center;
}
.home__curriculum-photo .bx-default-pager a {
background: #FFFFFF;
box-sizing: border-box;
border-radius: 50px;
display: block;
line-height: 100;
margin: 0 5px;
outline: 0 none;
width: 10px;
height: 10px;
overflow: hidden;
}
.home__curriculum-photo .bx-default-pager a:hover,
.home__curriculum-photo .bx-default-pager a.active {
background: #563200;
}
.home__curriculum-wrapper02 {
margin: -180px auto;
padding: 0 15px;
}
@media screen and (max-width: 1280px) {
.home__curriculum-wrapper02 {
margin: -100px auto;
}
}
@media screen and (max-width: 670px) {
.home__curriculum-wrapper02 {
margin: 0 auto;
}
}
.home__curriculum-wrapper02-box {
max-width: 1290px;
background-color: rgba(255,255,255,0.9);
box-sizing: border-box;
border-radius: 30px 30px 0 0;
margin: 0 auto;
position: relative;
z-index: 99;
}
.home__curriculum-wrapper02-box:after {
position: absolute;
top: 0;
left: 50%;
transform: translate(-50%,0);
content: '';
background: url(/youchien/assets/img/home/curriculum-bg02.png) no-repeat center top;
background-size: 978px auto;
width: 978px;
height: 411px;
z-index: -1;
}
@media screen and (max-width: 900px) {
.home__curriculum-wrapper02-box:after {
display: none;
}
}
.home__curriculum-wrapper02-title {
padding: 70px 0 60px;
text-align: center;
letter-spacing: 4px;
font-weight: 700;
font-size: 2.5rem;
color: #573100;
}
@media screen and (max-width: 670px) {
.home__curriculum-wrapper02-title {
padding: 35px 0 30px;
letter-spacing: 2px;
font-size: 2.0rem;
}
.home__curriculum-wrapper02-title br {
display: none;
}
}
.home__curriculum-wrapper02-text {
max-width: 580px;
margin: 0 auto;
line-height: 1.8;
font-size: 1.6rem;
}


.home__facility {
background: url(/youchien/assets/img/home/facility-bg01.jpg) no-repeat center center;
background-size: cover;
margin-top: 180px;
}
@media screen and (max-width: 1280px) {
.home__facility {
margin-top: 100px;
}
}
@media screen and (max-width: 670px) {
.home__facility {
margin-top: 0;
}
}
.home__facility-bg01 {
background: url(/youchien/assets/img/home/facility-bg02.png) no-repeat center top;
background-size: 1599px auto;
padding-top: 236px;
}
@media screen and (max-width: 670px) {
.home__facility-bg01 {
background-size: 799px auto;
padding-top: 120px;
}
}
.home__facility-bg02 {
background: url(/youchien/assets/img/home/facility-bg03.png) no-repeat center bottom;
background-size: 1920px auto;
padding-bottom: 140px;
}
@media screen and (max-width: 900px) {
.home__facility-bg02 {
background: none;
}
}
@media screen and (max-width: 670px) {
.home__facility-bg02 {
padding-bottom: 70px;
}
}
.home__facility-headline {
margin-bottom: 148px;
text-align: center;
}
@media screen and (max-width: 670px) {
.home__facility-headline {
margin-bottom: 74px;
}
}
.home__facility-headline img {
height: 60px;
}
@media screen and (max-width: 670px) {
.home__facility-headline img {
height: 40px;
}
}
.home__facility-text {
max-width: 580px;
margin: 0 auto 40px;
line-height: 1.8;
font-size: 1.6rem;
}
@media screen and (max-width: 670px) {
.home__facility-text {
margin: 0 auto 20px;
}
}
.home__facility-photo {
position: relative;
}
.home__facility-photo:before,
.home__facility-photo:after {
position: absolute;
bottom: 33px;
content: '';
width: 50%;
height: 50%;
box-shadow: 0 10px 15px rgba(0,0,0,.5);
}
@media screen and (max-width: 900px) {
.home__facility-photo:before,
.home__facility-photo:after {
bottom: 20px;
}
}
.home__facility-photo:before {
left: 20px;
-webkit-transform: rotate(-6deg);
transform: rotate(-6deg);
}
.home__facility-photo:after {
right: 20px;
-webkit-transform: rotate(6deg);
transform: rotate(6deg);
}
.home__facility-photo img {
box-sizing: border-box;
border: 10px solid #FFFFFF;
}
@media screen and (max-width: 670px) {
.home__facility-photo img {
border: 5px solid #FFFFFF;
}
}
.home__facility-photo .bx-wrapper {
background: #FFFFFF;
position: relative;
z-index: 9;
}
.home__facility-photo .bx-controls {
width: 100%;
box-sizing: border-box;
position: absolute;
left: 0;
bottom: -30px;
z-index: 90;
}
.home__facility-photo .bx-pager {
display: flex;
justify-content: center;
}
.home__facility-photo .bx-default-pager a {
background: #FFFFFF;
box-sizing: border-box;
border-radius: 50px;
display: block;
line-height: 100;
margin: 0 5px;
outline: 0 none;
width: 10px;
height: 10px;
overflow: hidden;
}
.home__facility-photo .bx-default-pager a:hover,
.home__facility-photo .bx-default-pager a.active {
background: #563200;
}


.home__news {
background: url(/assets/img/home/bg01.png) no-repeat center top;
background-size: 1856px auto;
padding: 238px 0 90px;
position: relative;
}
@media screen and (max-width: 670px) {
.home__news {
background-size: 928px auto;
padding: 120px 0 50px;
}
}
.home__news:after {
position: absolute;
left: 50%;
bottom: 61px;
content: '';
background: url(/assets/img/home/bg02.png) no-repeat center top;
background-size: 684px auto;
width: 684px;
height: 93px;
transform: translate(-50%,0);
z-index: -1;
}
@media screen and (max-width: 670px) {
.home__news:after {
display: none;
}
}
.home__news-headline {
margin-bottom: 148px;
text-align: center;
}
@media screen and (max-width: 670px) {
.home__news-headline {
margin-bottom: 74px;
}
}
.home__news-headline img {
height: 60px;
}
@media screen and (max-width: 670px) {
.home__news-headline img {
height: 40px;
}
}
.home__news-contents {
overflow: hidden;
}
.home__news-wrapper {
margin: 0 -30px 0;
display: flex;
flex-wrap: wrap;
}
@media screen and (max-width: 670px) {
.home__news-wrapper {
margin: 0;
display: block;
}
}
.home__news-box {
width: 25%;
box-sizing: border-box;
margin-bottom: 60px;
padding: 0 30px;
}
@media screen and (max-width: 1024px) {
.home__news-box {
width: 50%;
}
}
@media screen and (max-width: 670px) {
.home__news-box {
width: 100%;
margin-bottom: 30px;
padding: 0 15px;
}
}
.home__news-header {
position: relative;
}
.home__news-img {
background-size: cover;
background-position: center center;
border-radius: 100%;
position: relative;
overflow: hidden;
}
.home__news-img:after {
content: '';
padding-top: 100%;
display: block;
}
.home__news-category {
text-align: center;
font-weight: 500;
font-size: 1.2rem;
position: absolute;
right: 0;
bottom: 0;
}
.home__news-category a {
width: 78px;
height: 78px;
box-sizing: border-box;
padding: 0 10px;
color: #FFFFFF;
display: flex;
justify-content: center;
align-items: center;
transition: 0.3s;
}
.home__news-category.cat3 a {
background: url(/assets/img/home/category01.png) no-repeat center center;
background-size: 78px auto;
}
.home__news-category.cat6 a {
background: url(/assets/img/home/category02.png) no-repeat center center;
background-size: 78px auto;
}
.home__news-category.cat11 a {
background: url(/assets/img/home/category03.png) no-repeat center center;
background-size: 78px auto;
}
.home__news-category.cat16 a {
background: url(/assets/img/home/category04.png) no-repeat center center;
background-size: 78px auto;
}
.home__news-category a:hover {
text-decoration: none;
opacity: 0.9;
}
.home__news-body {
margin: 18px 0 23px;
display: flex;
justify-content: space-between;
align-items: center;
}
.home__news-date {
margin-right: 20px;
text-align: center;
line-height: 1;
font-weight: 800;
font-size: 6.0rem;
letter-spacing: -1px;
color: #673b20;
}
.home__news-date small {
font-weight: 600;
font-size: 2.0rem;
display: block;
}
.home__news-title {
font-weight: 600;
font-size: 2.3rem;
}
.home__news-title a {
color: #673b20;
transition: 0.3s;
}
.home__news-title a:hover {
text-decoration: none;
color: #998675;
}
.home__news-text {
line-height: 1.8;
font-size: 1.6rem;
}
.home__news-btn {
max-width: 300px;
margin: 0 auto;
text-align: center;
font-weight: 700;
font-size: 1.5rem;
letter-spacing: 1px;
}
.home__news-btn a {
background: #FFFFFF;
border: 1px solid #333333;
box-sizing: border-box;
border-radius: 50px;
padding: 22px 0;
color: #333333;
display: block;
overflow: hidden;
position: relative;
z-index: 1;
transition: 0.3s;
}
.home__news-btn a:hover {
text-decoration: none;
color: #FFFFFF;
}
@media screen and (max-width: 1024px) {
.home__news-btn a:hover {
color: #333333;
}
}
.home__news-btn a:after {
position: absolute;
top: 0;
right: 0;
content: '';
width: 0;
height: 100%;
background: #333333;
transition: 0.3s;
z-index: -1;
}
@media screen and (max-width: 1024px) {
.home__news-btn a:after {
display: none;
}
}
.home__news-btn a:hover:after {
width: 100%;
left: 0;
}
@media screen and (max-width: 1024px) {
.home__news-btn a:hover:after {
display: none;
}
}


.item__contact {
background: #ecefb6;
padding: 30px 0;
}
.item__contact-wrapper {
display: flex;
justify-content: space-between;
align-items: center;
}
@media screen and (max-width: 670px) {
.item__contact-wrapper {
display: block;
}
}
.item__contact-headline {
width: 26.984126%;
}
@media screen and (max-width: 670px) {
.item__contact-headline {
width: 100%;
margin-bottom: 20px;
}
}
.item__contact-box {
width: 68.253968%;
}
@media screen and (max-width: 670px) {
.item__contact-box {
width: 100%;
}
}
.item__contact-text {
margin-bottom: 20px;
line-height: 1.8;
font-size: 1.6rem;
}
.item__contact-area {
display: flex;
justify-content: space-between;
align-items: center;
}
@media screen and (max-width: 900px) {
.item__contact-area {
display: block;
}
}
.item__contact-title {
background: #FFFFFF;
border-top: 2px dashed #673b20;
border-bottom: 2px dashed #673b20;
padding: 20px 15px;
letter-spacing: 2px;
text-align: center;
font-weight: 700;
font-size: 1.3rem;
color: #683c1f;
}
@media screen and (max-width: 900px) {
.item__contact-title {
margin-bottom: 20px;
}
}
@media screen and (max-width: 670px) {
.item__contact-title {
letter-spacing: normal;
}
}
.item__contact-tel {
font-weight: 800;
line-height: 1;
font-size: 6.5rem;
}
@media screen and (max-width: 1024px) {
.item__contact-tel {
font-size: 4.5rem;
}
}
@media screen and (max-width: 900px) {
.item__contact-tel {
text-align: center;
}
}
@media screen and (max-width: 670px) {
.item__contact-tel {
font-size: 3.4rem;
}
}
.item__contact-tel span {
background: url(/assets/img/common/youchien-icon-tel01.png) no-repeat left 0.4em;
background-size: 50px auto;
padding-left: 60px;
color: #683c1f;
}
@media screen and (max-width: 1024px) {
.item__contact-tel span {
background-size: 35px auto;
padding-left: 40px;
}
}
@media screen and (max-width: 670px) {
.item__contact-tel span {
background-size: 26px auto;
padding-left: 30px;
}
}
.item__contact-tel a {
color: #683c1f;
}


.item__banner {
background: url(/assets/img/common/banner-bg01.jpg) repeat center center;
background-size: auto 151px;
padding-top: 30px;
}
.item__banner ul {
margin: 0 -15px;
display: flex;
flex-wrap: wrap;
}
@media screen and (max-width: 670px) {
.item__banner ul {
margin: 0;
display: block;
}
}
.item__banner li {
width: 25%;
box-sizing: border-box;
padding: 0 15px 30px;
}
@media screen and (max-width: 900px) {
.item__banner li {
width: 50%;
}
}
@media screen and (max-width: 670px) {
.item__banner li {
width: 100%;
padding: 0 0 30px;
}
}

/*****************************************************************************
footer 
*****************************************************************************/

.footer {
background: url(/assets/img/common/footer-bg01.jpg) repeat center top;
background-size: 1250px auto;
padding: 40px 0;
}
.footer__wrapper-navi {
margin-bottom: 34px;
display: flex;
justify-content: center;
flex-wrap: wrap;
}
@media screen and (max-width: 1024px) {
.footer__wrapper-navi {
justify-content: flex-start;
}
}
.footer__wrapper-navi li {
box-sizing: border-box;
margin-bottom: 7px;
padding: 0 15px;
}
@media screen and (max-width: 1024px) {
.footer__wrapper-navi li {
width: 25%;
}
}
@media screen and (max-width: 900px) {
.footer__wrapper-navi li {
width: 50%;
}
}
@media screen and (max-width: 670px) {
.footer__wrapper-navi li {
font-size: 1.3rem;
}
}
.footer__wrapper-navi li a {
display: flex;
align-items: center;
color: #69402a;
}
.footer__wrapper-navi li img {
width: 17px;
margin-right: 5px;
}
.footer__wrapper-logo {
margin-bottom: 11px;
text-align: center;
font-weight: 600;
font-size: 3.5rem;
letter-spacing: 4px;
}
@media screen and (max-width: 670px) {
.footer__wrapper-logo {
font-size: 3.0rem;
letter-spacing: 2px;
}
}
.footer__wrapper-logo small {
font-weight: 400;
font-size: 1.7rem;
letter-spacing: 1px;
display: inline-block;
}
@media screen and (max-width: 670px) {
.footer__wrapper-logo small {
font-size: 1.5rem;
}
}
.footer__wrapper-logo img {
width: 191px;
margin: 0 auto 7px;
}
.footer__wrapper-logo a {
color: #6b3e21;
transition: 0.3s;
}
.footer__wrapper-logo a:hover {
text-decoration: none;
opacity: 0.7;
}
.footer__wrapper-address {
margin-bottom: 2px;
text-align: center;
font-size: 1.6rem;
color: #6b3e21;
}
@media screen and (max-width: 670px) {
.footer__wrapper-address {
font-size: 1.4rem;
}
}
.footer__wrapper-tel {
margin-bottom: 19px;
text-align: center;
font-weight: 800;
font-size: 4.0rem;
}
.footer__wrapper-tel a {
color: #673b20;
}
@media screen and (max-width: 670px) {
.footer__wrapper-tel {
font-size: 3.4rem;
}
}
.footer__wrapper-tel span {
background: url(/assets/img/common/youchien-icon-tel01.png) no-repeat left center;
background-size: 32px auto;
padding-left: 44px;
color: #673b20;
}
@media screen and (max-width: 670px) {
.footer__wrapper-tel span {
background-size: 26px auto;
padding-left: 30px;
}
}
.footer__wrapper-btn {
margin-bottom: 50px;
display: flex;
justify-content: center;
}
.footer__wrapper-btn li {
width: 50%;
max-width: 210px;
padding: 0 15px;
text-align: center;
font-size: 1.4rem;
letter-spacing: 1px;
}
@media screen and (max-width: 670px) {
.footer__wrapper-btn li {
padding: 0 5px;
font-size: 1.2rem;
letter-spacing: normal;
}
}
.footer__wrapper-btn a {
background: #FFFFFF;
border: 1px solid #633e24;
box-sizing: border-box;
border-radius: 50px;
padding: 5px 0;
color: #633e24;
display: block;
overflow: hidden;
position: relative;
z-index: 1;
transition: 0.3s;
}
.footer__wrapper-btn a:hover {
text-decoration: none;
color: #FFFFFF;
}
@media screen and (max-width: 1024px) {
.footer__wrapper-btn a:hover {
color: #633e24;
}
}
.footer__wrapper-btn a:after {
position: absolute;
top: 0;
right: 0;
content: '';
width: 0;
height: 100%;
background: #633e24;
transition: 0.3s;
z-index: -1;
}
@media screen and (max-width: 1024px) {
.footer__wrapper-btn a:after {
display: none;
}
}
.footer__wrapper-btn a:hover:after {
width: 100%;
left: 0;
}
@media screen and (max-width: 1024px) {
.footer__wrapper-btn a:hover:after {
display: none;
}
}


.footer__copyright {
text-align: center;
font-size: 1.6rem;
color: #673b20;
}
@media screen and (max-width: 670px) {
.footer__copyright {
font-size: 1.4rem;
}
}


#page-top {
position: fixed;
right: 10px;
bottom: 50px;
opacity: 0;
filter: alpha(opacity=0);
}
@media screen and (max-width: 900px) {
#page-top {
display: none;
}
}
#page-top i {
position: fixed;
top: 0;
right: 65px;
width: 1px;
height: 80%;
background: #ececec;
z-index: -1;
}
#page-top img {
width: 104px
}

/*****************************************************************************
 transform 
 *****************************************************************************/

.hide__pc {
display: none;
}
@media screen and (max-width: 670px) {
.hide__pc {
display: block;
}
}


.effect {
	opacity: 0;
	transform: translate(0,30px);
	transition: all 0.7s;
}
.fadeIn {
	opacity: 1.0;
	transform: translate(0,0);
}