/*
Theme Name: Wakayama Ichibanboshi
Author: Media Presto
Author URI: https://media-presto.com
Version: 1.0.1
*/
@import url('https://fonts.googleapis.com/css2?family=Sawarabi+Gothic&display=swap');
@import url('https://cdn.jsdelivr.net/npm/vanillajs-datepicker@1.3.4/dist/css/datepicker.min.css');
@import url('https://cdn.jsdelivr.net/npm/vanillajs-datepicker@1.3.4/dist/css/datepicker-bs5.min.css');
:root{
	 --orange-color: #F39800;
	 --orange-dark-color: #F45404;
}
body {-webkit-overflow-scrolling: touch; -webkit-font-smoothing: antialiased;  scroll-behavior: smooth; background: #ffffff;color: #666666; font-family: "Sawarabi Gothic", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Meiryo, メイリオ, Osaka, "MS PGothic", arial, helvetica, sans-serif; font-size: 16px; line-height: 32px ;font-weight: 400; padding-top: 150px; }
@media(max-width: 575.98px) { 
	body, p{ font-size: 16px }
}
@media(max-width: 480px) { 
	body, p{ font-size: 14px }
}
/* Paragraph & Typographic */
h1, h2, h3, h4, h5, h6 { color: #3C2B2D;  font-weight: 300;  }
h1 { font-size: 35px; margin-bottom: 30px; margin-top: 30px; }
p { font-size: 16px; line-height: 28px; margin-bottom: 25px; }
.centered { text-align: center; }
/* Links */
a {-webkit-transition: color 0.1s ease-in, background 0.1s ease-in; -o-transition: color 0.1s ease-in, background 0.1s ease-in; -ms-transition: color 0.1s ease-in, background 0.1s ease-in; -moz-transition: color 0.1s ease-in, background 0.1s ease-in; color: #000000; transition: color 0.1s ease-in, background 0.1s ease-in; word-wrap: break-word;  }
a:hover,a:focus { color: #222; outline: 0; text-decoration: none; }
a:before, a:after {-webkit-transition: color 0.1s ease-in, background 0.1s ease-in; -o-transition: color 0.1s ease-in, background 0.1s ease-in; -ms-transition: color 0.1s ease-in, background 0.1s ease-in; -moz-transition: color 0.1s ease-in, background 0.1s ease-in; transition: color 0.1s ease-in, background 0.1s ease-in; }

#header{ -webkit-box-shadow: 0 1px 2px rgba(220, 220, 220, 0.5); box-shadow: 0 1px 2px rgba(220, 220, 220, 0.5); position: relative; padding-top: 10px; width: 100%; background-color: #FFFFFF;}
.sticky-top{ position: fixed !important; }
#main-navbar .nav-item{ margin-left: 0; display: flex; align-items: center; font-size: 14px;}

#main-navbar .nav-item .nav-link{ color: #000;}
#main-navbar .nav-item .nav-link:hover{ text-decoration: underline;}
.btn-head-overview{ background-color: var(--orange-color)}
.btn-head-seminar{ background-color: var(--orange-dark-color);}
.btn-head{text-decoration: none; padding: 5px 24px; color:#FFFFFF; text-align: center; font-size: 14px;}
.btn-head:hover{ opacity: 0.8;}

.form .btn{color: #FFFFFF; padding: 12px 40px !important; border-radius: 0; min-width: 200px;}
.form .btn:hover{opacity: 0.8;color: #FFFFFF; }
.btn-secondary, .btn-secondary:hover{ background-color: #CCCCCC; border-color: #CCCCCC; }
.btn-orange, .btn-orange:hover{ background-color: var(--orange-color); }
.btn-orange-dark, .btn-orange-dark:hover{ background-color: var(--orange-dark-color); }

.h1-subpage-title{ margin-bottom: 40px;}
form input{ height: 45px; border-radius: 4px;}

.nav-step .nav-item{ display: flex; min-height:70px; position: relative;}
.nav-step .nav-item::before{ content: ''; width: 40px; height:40px; background: url('images/icons/icon-step.png')center center no-repeat; background-size: 40px 40px;  display: inline-block;}
.nav-step .nav-item.current::before{background: url('images/icons/icon-step-active.png')center center no-repeat; }
.nav-step .nav-item.complete::before{background: url('images/icons/icon-step-complete.png')center center no-repeat; }
.nav-step .nav-item:not(:last-child)::after{ content: ''; width: 5px; height: 100%; position: absolute;  z-index: -2;}
.nav-step .nav-item.complete:not(:last-child)::after{ border-left: 5px solid #2EAF98; }


@media (min-width: 992px){

	#main-navbar .nav-item:first-child:before{content: ""; }
	#main-navbar .nav-item::before{ content: "｜"; margin-left: 5px; margin-right: 5px;}
	.nav-step .nav-item:not(:last-child)::after{ left: 18px; top: 0; border-left: 5px solid #B7B7B7; }
	.nav-step .nav-link{width: calc(100% - 50px); margin-left: 10px;}

}
@media(max-width: 991.98px) { 
    body{ padding-top: 65px;}
	.navbar-toggler{ width: 40px; height: 40px; border:1px solid #666; border-radius: 4px; font-size: 20x; padding-top: 5px;}
	.navbar-toggler[aria-expanded="false"] .navbar-toggler-icon::before{content: "\f0c9";}
	.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::before{content: "\f077";}

	#main-navbar{ position: absolute; top:20px; left: 0; width: 100%; background-color: #FFF;}
	#main-navbar .nav-item{ padding: 8px 15px; border-bottom: 1px solid #f7f7f7;}
	.nav-step{ display: flex; justify-content: space-between; overflow: hidden;}
	.nav-step .nav-item{ flex-direction: column;align-items: center; width: 100%; font-size: 12px; }
	.nav-step .nav-link{width: auto ; margin-left: 0; padding: 10px 5px;}
	.nav-step .nav-item:not(:last-child)::after{ top:20px; left: 50%;  height: 3px!important; width: 100% !important; border-top: 5px solid #B7B7B7;}
}
@media(max-width: 420px) { 
.nav-step .nav-link{ font-size:10px ; line-height: 15px; text-align: center;}
.nav-step .nav-item{ width: 50px;}
.nav-step .nav-item:not(:last-child)::after{ width: 30px;}
}


/* Footer ============================*/
#gotop{ position: relative; }
#smoothup {background: #FFFFFF; color:#F39800; border:1px solid #F39800; text-align: center; font-size: 24px; width: 50px; height: 50px; position: fixed; bottom: 60px; right: 10px; margin: 0 auto; z-index: 100; display: flex; justify-content: center; align-items: center; text-decoration: none;}
#smoothup:hover {cursor: pointer; -webkit-animation-name: pulse; animation-name: pulse; animation-duration: 0.8s; animation-delay: 0s; }
#footer { background-color: #CCCCCC; padding: 80px; }
#copyright{ color: #666666;}

/* Helpers ============================*/
hr {border: 0; border-top: 1px solid #ccc; display: block; height: 1px; margin: 1em 0; padding: 0; }
.mt { margin-bottom: 40px; margin-top: 40px; }
.pt { padding-bottom: 50px; padding-top: 50px; }
.btn{ border-radius: 2px; padding: 7px 20px; font-size: 16px; }
ul{ list-style: none;}
.btn-primary-orange{ background-color: #F39800; border-color:#F39800; padding: 12px 30px; text-decoration: none; color: #FFFFFF; display: inline-block;}
.btn-primary-orange:hover,.btn-primary-orange:not(:disabled):not(.disabled):active,.btn-primary:focus{ background-color:#F39800; opacity: 0.8; color: #FFFFFF;}


/* Animation ============================*/
.animate__delay-02{-webkit-animation-delay:0.2s !important;animation-delay:0.2s!important;}
.animate__delay-04{-webkit-animation-delay:0.4s !important;animation-delay:0.4s!important;}
.hover-animate:hover { transform: scale(1.008);}
.hover-animate { transition-duration: 0.3s; transform: rotate(0.0001deg); outline: 1px solid transparent; transform: rotate(0.001deg);}

.animated-left{ transition: all .5s cubic-bezier(0.165, 0.84, 0.44, 1);    transform: translateX(1.5rem); opacity: 0}
.animated-left.play{ transform: translateX(0); opacity: 1;}
.animated-up{ -webkit-transition: 0.8s; -o-transition: 0.8s; transition: 0.8s; opacity: 0; -webkit-transform: translateY(50px); -ms-transform: translateY(50px); transform: translateY(50px);}
.animated-up.play { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0);}



/* +++++ WRAP SECTIONS ============================*/
#ww {/*padding-bottom: 60px; padding-top: 70px; */}
#grey { background-color: #f2f2f2; padding-bottom: 60px; padding-top: 60px; }
#white { background-color: #ffffff; padding-bottom: 60px; padding-top: 60px; }

/* Blog*/
bd {color: #d2d2d2; font-size: 12px; font-weight: 700; text-transform: uppercase; }
ba { font-size: 12px; padding-left: 5px; text-transform: uppercase; }
.bq { font-size: 22px; padding-top: 30px; }
bt { font-size: 12px; }

/*  PORTFOLIO IMAGES HOVER EFFECT ================== */
/* Effects also are controled by hover.zoom.js */
.zoom {display:block; position:relative; overflow:hidden; background:transparent url(images/loader.gif) no-repeat center; }
.zoomOverlay {position:absolute; top:0; left:0; bottom:0; right:0; display:none; background-image:url(images/zoom.png); background-repeat:no-repeat; background-position:center; }
.zoom2 {opacity: 1; }
.zoom2:hover {opacity: 0.5; }
.glyphicon { color: #1652a1; font-size: 40px; }
.wp-user-avatar {margin: 0;}

h2.ttl-primary{ color: #666666; font-weight: 500; position: relative; text-align: center; margin-bottom: 15px; padding-bottom: 15px;}
h2.ttl-primary span{ position: relative;}
h2.ttl-primary span:after{ border-top: 2px solid #F39800; bottom: -8px; content: "";
 display: block; position: absolute;  left: 0; width: 100%;}
/* Toppage  ========================== */
.home-banner { background-color: #FFFFFF; min-height: 550px; background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;}


.home-qoutes{ background-color:#FFFFFF;}
.home-qoutes p{ font-size: 20px;}
.home-about .table-about dl{ margin-bottom: 0;}
.home-about .table-about dt{ background-color:#EFEFEF ;     padding: 4px 8px;}
.home-about .table-about dd{padding: 8px; margin-bottom: 0;}
.home-about .table-about ul{ list-style: circle; padding-left: 30px;}
.home-point .list-point li .fa::before{ content:"\f00c" ; font-size: 24px;margin-right: 10px;}

.home-schedule .list-schedule{ display: flex; overflow: hidden;}
.home-schedule .list-schedule .item-schedule{background: #F39800; color: #FFF;line-height: 1; width: 180px; padding: 20px 15px 20px 20px; position: relative;
 margin-right: 30px; margin-bottom: 20px; }
.home-schedule .list-schedule .item-schedule::after{ content: ""; position: absolute; height: 0; width: 0; border-bottom: 56px solid transparent; border-left: 29px solid #F39800;border-top: 56px solid transparent; right: auto; left: 100%; top: 50%;-webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); z-index: 1;}
.home-schedule .list-schedule .item-schedule .inner{ height: 60px; margin-bottom: 10px; display: flex; flex-direction: column; justify-content: center;}
.home-schedule .list-schedule .item-schedule p{ margin-bottom: 0; text-align: center; font-size: 14px; line-height: 20px;}

.home-schedule .list-schedule2 .item-schedule{ border: 3px solid #F39800; margin-bottom: 40px; position: relative; padding:20px 20px 0 20px; position: relative;}
.home-schedule .list-schedule2 .item-schedule:not(:last-child)::before,
.home-schedule .list-schedule2 .item-schedule:not(:last-child)::after{ height: 0; width: 0; border-left: 15px solid transparent; border-right: 15px solid transparent; content: ""; display: block; position: absolute; left: 50%;-webkit-transform: translateX(-50%);    -ms-transform: translateX(-50%); transform: translateX(-50%); }
.home-schedule .list-schedule2 .item-schedule:not(:last-child)::before{border-top: 20px solid #F39800;bottom: -20px; z-index: 1;}
.home-schedule .list-schedule2 .item-schedule:not(:last-child)::after{border-top: 20px solid #FFFFFF; bottom: -16px; z-index: 2;}
.home-schedule .list-schedule2 .item-schedule .inner{ border-bottom: 1px solid #F39800; }
.home-schedule .list-schedule2 .item-schedule .inner p { font-size: 24px;  line-height: 30px;}
.home-schedule .list-schedule2 .item-schedule .inner p > span{ display: inline-block; background-color: #F39800; border-radius: 50%; color: #fff; font-weight: bold; text-align: center; overflow: hidden;    font-size: 14px; line-height: 30px; height: 30px; width: 30px; margin: 0 8px 0 5px;}

.home-seminar .item-seminar h3{ border-bottom: solid 2px #F39800; padding-bottom: 5px;}
.home-seminar .item-seminar dl dt{ background-color: #EFEFEF; font-weight: bold;}
.home-seminar .item-seminar dl dt,.home-seminar .item-seminar dl dd{padding: 4px 8px; }

.control-label{ font-size: 15px;}
.home-seminar .form-seminar .control-label.required::after { background-color: #AE3023; border-radius: 3px; content: "必須"; color: #fff; font-size: 80%; font-weight: normal; margin: 0 0 0 5px; padding: 2px 3px;}
.home-seminar .form-seminar .form-control{ border-bottom: 1px solid #bbb; border-left: 0; border-right:0 ; border-top: 0; border-radius: 0;}
.home-policy .accordion-item .accordion-header{border-bottom: solid 2px #F39800;  }
.home-policy .accordion-item .accordion-button{ padding: 20px;}
.home-policy .accordion-item .accordion-button:hover{background-color: rgba(243, 152, 0, 0.1); }

.home-policy .accordion-item .accordion-button::after{ content: '\f107'; background-image: none; font-size: 30px; color: #F39800;}
.home-policy .accordion-item .accordion-button:focus{ border: none; box-shadow: none}

.home-policy .accordion-item .accordion-button:not(.collapsed){ color:#222; background-color: rgba(243, 152, 0, 0.1);}

.home-contact .p-tel{ font-size: 24px;}
.home-contact .p-email{ font-size: 14px;}
.btn-contact-link{ background-color: #CCCCCC; color: #FFFFFF; padding: 10px 30px; text-align: center;  line-height: 25px; text-decoration: none;}
.btn-contact-link:hover{ opacity: 0.8}

@media(max-width: 767.98px) { 
	.home-banner { min-height: 200px;}
    .home-banner img{ width: 130px;}
	.home-schedule .list-schedule .item-schedule{ width: 100%;margin-bottom: 52px;margin-right: 0; padding: 20px 15px 0 15px}
	.home-schedule .list-schedule .item-schedule .inner{ height: auto; }
	.home-schedule .list-schedule .item-schedule::after{ border-top: 49px solid #F39800; border-left: 50vw solid transparent;
 border-right: 50vw solid transparent;left: 50%; top: 100%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%);}

}

.form-wrap{ background-color: #F8F7F3 ;}
.form-apply .form-group{ border-bottom: 1px solid #D9D9D9; padding-bottom: 15px;}
.form-apply .control-label,.form-login .control-label{ font-weight: normal;}
.form-apply .control-label.required::before,
.form-login .control-label.required::before { background-color: #AE3023; border-radius: 3px; content: "必須"; color: #fff; font-size: 80%; font-weight: normal; margin-right: 5px; padding: 2px 3px;}
.form-apply textarea.form-control{ min-height: 80px;}
.form-apply .input-group-upload input{ height: auto;}
.form-apply .form-remark{ font-size: 80%; color: #666666;;}
form label.error{ color: #AE3023;}

.product_spec > .row{ border-bottom: 1px dotted #222222; position:relative;}
.product_spec > .row .control-title{ position:absolute; left: -55px; width: 60px; text-align: right; top: 30px; font-size: 15px;} 
.input-group-text{ font-size: 14px;}

.upload-images h4{ background-color: #000000; color: #FFFFFF; font-size: 18px; font-weight: 500; padding: 8px 30px; border-radius: 4px;}
.upload-images .input-group-upload label{ background-color: #1652a1; color: #FFFFFF;}
.item-file-wrap .input-group { width: calc(100% - 95px);}
.upload-images .btn-delete{ width: 80px; margin-left: 10px;}
.upload-processedFoods h5{ border-bottom:2px solid #666666; padding: 8px 0; margin-bottom: 15px;}