/* CSS Document ゆいすまオキナワ様 PC共通CSS*/



/*-----------------------------------------------
Eric Meyer’s  CSS Reset
-------------------------------------------------*/	
/* 
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
Twitter: @rich_clark
*/

html, body, div:not(:where(.hx1)), span, object, iframe,
:is(h1,:where(.hx1)), h2:not(:where(.hx1)), h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, img, ins, kbd, q, samp,
small, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
color:#222;
line-height:120%
}

body {
line-height:180%; letter-spacing:.05em;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
display:block;
}

nav , ul {
list-style:none;
text-decoration:none !important;
}

blockquote, q {
quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
content:"";
content:none;
}

a {
margin:0;
padding:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
color:inherit;
text-decoration:none 
}

u, ins {
text-decoration:none !important;
}

/ change colours to suit your needs /
ins {
background-color:#ff9;
color:#000;
text-decoration:none;
}

/ change colours to suit your needs /
mark {
background-color:#ff9;
color:#000; 
font-style:italic;
font-weight:bold;
}

del {
text-decoration: line-through;
}

abbr[title], dfn[title] {
border-bottom:1px dotted;
cursor:help;
}

table {
border-collapse:collapse;
border-spacing:0;
}

/* change border colour to suit your needs 
*/
hr {
display:block;
height:1px;
border:0; 
border-top:1px solid #cccccc;
margin:1em 0;
padding:0;
}

input, select {
vertical-align:middle;
}


*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}

input, textarea{
-webkit-appearance: none;
border-radius: 0;
}


main {
    margin-top: 70px;
}

/*-----------------------------------------------
layout
-------------------------------------------------*/	


html { font-size: 62.5%; } /* 10px */
body { font-size: 1.7rem} /* 17px */
p, address, button {
    font-size: 1.7rem;
    font-weight: 300;
    letter-spacing: 0rem;
}
dt , dd {
    font-size: 1.6rem;
    letter-spacing: 0rem;
}

dd{font-weight:300}


:is(h1,:where(.hx1))  { font-size: 1.9rem; } /* 20px */
h2:not(:where(.hx1)) , h3 { font-size: 1.8rem; font-weight:500} /* 18px */
input, textarea, select {
    font-size: 1.6rem;
    font-weight: 300;
}
p , div:not(:where(.hx1)) {line-height:140%;}
:is(h1,:where(.hx1)) , h2:not(:where(.hx1)) , h3 {vertical-align:bottom; letter-spacing:0.1rem}



body , textarea , input , button , select{
	font-family: "Noto Sans JP" , YuGothic, "Yu Gothic", 游ゴシック, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif
;}


address{ font-style:normal}


/* ------ margin ------ */

.margin_a{margin:auto}


.mt0   { margin-top:0 !important; }
.mt5   { margin-top:5px !important; }
.mt10  { margin-top:10px !important; }
.mt15  { margin-top:15px !important; }
.mt20  { margin-top:20px !important; }
.mt25  { margin-top:25px !important; }
.mt30  { margin-top:30px !important; }
.mt35  { margin-top:35px !important; }
.mt40  { margin-top:40px !important; }
.mt45  { margin-top:45px !important; }
.mt50  { margin-top:50px !important; }
.mt55  { margin-top:55px !important; }
.mt60  { margin-top:60px !important; }
.mt65  { margin-top:65px !important; }
.mt70  { margin-top:70px !important; }
.mt75  { margin-top:75px !important; }
.mt80  { margin-top:80px !important; }
.mt85  { margin-top:85px !important; }
.mt90  { margin-top:90px !important; }
.mt95  { margin-top:95px !important; }
.mt100 { margin-top:100px !important; }

.mr0   { margin-right:0 !important; }
.mr5   { margin-right:5px !important; }
.mr10  { margin-right:10px !important; }
.mr15  { margin-right:15px !important; }
.mr20  { margin-right:20px !important; }
.mr25  { margin-right:25px !important; }
.mr30  { margin-right:30px !important; }
.mr35  { margin-right:35px !important; }
.mr40  { margin-right:40px !important; }
.mr45  { margin-right:45px !important; }
.mr50  { margin-right:50px !important; }
.mr55  { margin-right:55px !important; }
.mr60  { margin-right:60px !important; }

.mb0   { margin-bottom:0 !important; }
.mb5   { margin-bottom:5px !important; }
.mb10  { margin-bottom:10px !important; }
.mb15  { margin-bottom:15px !important; }
.mb20  { margin-bottom:20px !important; }
.mb25  { margin-bottom:25px !important; }
.mb30  { margin-bottom:30px !important; }
.mb35  { margin-bottom:35px !important; }
.mb40  { margin-bottom:40px !important; }
.mb45  { margin-bottom:45px !important; }
.mb50  { margin-bottom:50px !important; }
.mb55  { margin-bottom:55px !important; }
.mb60  { margin-bottom:60px !important; }
.mb65  { margin-bottom:65px !important; }
.mb70  { margin-bottom:70px !important; }
.mb75  { margin-bottom:75px !important; }
.mb80  { margin-bottom:80px !important; }
.mb85  { margin-bottom:85px !important; }
.mb90  { margin-bottom:90px !important; }
.mb95  { margin-bottom:95px !important; }
.mb100 { margin-bottom:100px !important; }

.ml0   { margin-left:0 !important; }
.ml5   { margin-left:5px !important; }
.ml10  { margin-left:10px !important; }
.ml15  { margin-left:15px !important; }
.ml20  { margin-left:20px !important; }
.ml25  { margin-left:25px !important; }
.ml30  { margin-left:30px !important; }
.ml35  { margin-left:35px !important; }
.ml40  { margin-left:40px !important; }
.ml45  { margin-left:45px !important; }
.ml50  { margin-left:50px !important; }
.ml55  { margin-left:55px !important; }
.ml60  { margin-left:60px !important; }

/* ------ padding ------ */
.pt0   { padding-top:0 !important; }
.pt5   { padding-top:5px !important; }
.pt10  { padding-top:10px !important; }
.pt15  { padding-top:15px !important; }
.pt20  { padding-top:20px !important; }
.pt25  { padding-top:25px !important; }
.pt30  { padding-top:30px !important; }
.pt35  { padding-top:35px !important; }
.pt40  { padding-top:40px !important; }
.pt45  { padding-top:45px !important; }
.pt50  { padding-top:50px !important; }
.pt55  { padding-top:55px !important; }
.pt60  { padding-top:60px !important; }
.pt65  { padding-top:65px !important; }
.pt70  { padding-top:70px !important; }
.pt75  { padding-top:75px !important; }
.pt80  { padding-top:80px !important; }
.pt85  { padding-top:85px !important; }
.pt90  { padding-top:90px !important; }
.pt95  { padding-top:95px !important; }
.pt100 { padding-top:100px !important; }

.pr0   { padding-right:0 !important; }
.pr5   { padding-right:5px !important; }
.pr10  { padding-right:10px !important; }
.pr15  { padding-right:15px !important; }
.pr20  { padding-right:20px !important; }
.pr25  { padding-right:25px !important; }
.pr30  { padding-right:30px !important; }
.pr40  { padding-right:40px !important; }
.pr45  { padding-right:45px !important; }
.pr50  { padding-right:50px !important; }
.pr55  { padding-right:55px !important; }
.pr60  { padding-right:60px !important; }

.pb0   { padding-bottom:0 !important; }
.pb5   { padding-bottom:5px !important; }
.pb10  { padding-bottom:10px !important; }
.pb15  { padding-bottom:15px !important; }
.pb20  { padding-bottom:20px !important; }
.pb25  { padding-bottom:25px !important; }
.pb30  { padding-bottom:30px !important; }
.pb35  { padding-bottom:35px !important; }
.pb40  { padding-bottom:40px !important; }
.pb45  { padding-bottom:45px !important; }
.pb50  { padding-bottom:50px !important; }
.pb55  { padding-bottom:55px !important; }
.pb60  { padding-bottom:60px !important; }
.pb65  { padding-bottom:65px !important; }
.pb70  { padding-bottom:70px !important; }
.pb75  { padding-bottom:75px !important; }
.pb80  { padding-bottom:80px !important; }
.pb85  { padding-bottom:85px !important; }
.pb90  { padding-bottom:90px !important; }
.pb95  { padding-bottom:95px !important; }
.pb100 { padding-bottom:100px !important; }

.pl0    { padding-left:0 !important; }
.pl5    { padding-left:5px !important; }
.pl10   { padding-left:10px !important; }
.pl15   { padding-left:15px !important; }
.pl20   { padding-left:20px !important; }
.pl25   { padding-left:25px !important; }
.pl30   { padding-left:30px !important; }
.pl35   { padding-left:35px !important; }
.pl40   { padding-left:40px !important; }
.pl45   { padding-left:45px !important; }
.pl50   { padding-left:50px !important; }
.pl55   { padding-left:55px !important; }
.pl60   { padding-left:60px !important; }
				

.suptext {
	font-size: 75.5%;
	vertical-align: top;
	position: relative;
	top: -0.1em;
}

/*reCAPTCHA v3*/
.grecaptcha-badge{ margin:auto !important}


/*-----------------------------------------------
basic template 2018.12.5
-------------------------------------------------*/	



/* ------ text ------ */
.text_l { text-align:left !important}
.text_c { text-align:center !important}
.text_r { text-align:right !important }
.text_c_pc { text-align:center !important}

.letter_s01{letter-spacing:-0.1rem !important }
.letter_s0{letter-spacing:0rem !important}
.letter_s1{letter-spacing:0.1rem !important}
.letter_s5{letter-spacing:0.5rem !important}


/* ------ float ------ */
.fl { float:left  !important;}
.fr { float:right !important; }
.fn { float:none !important; }


/* ------ clearfix ----- */
.clearfix:after { display:block; clear:both; height:0; visibility:hidden; content:" "; }
.clear { clear:both;}


/* ---- font ---- */
.fontw_l1 { font-weight:100 !important;}/*light*/
.fontw_l2 { font-weight:300 !important;}/*light*/
.fontw_r { font-weight:400 !important;}/*regular*/
.fontw_m { font-weight:500 !important;}/*medium*/
.fontw_b { font-weight:700 !important;}/*bold*/
.fontw_n { font-weight:normal !important;}

.font_s11 { font-size:1.1rem !important;}
.font_s12 { font-size:1.2rem !important;}
.font_s13 { font-size:1.3rem !important;}
.font_s14 { font-size:1.4rem !important;}
.font_s15 { font-size:1.5rem !important;}
.font_s16 { font-size:1.6rem !important;}
.font_s17 { font-size:1.7rem !important;}
.font_s18 { font-size:1.8rem !important;}
.font_s19 { font-size:1.9rem !important;}
.font_s20 { font-size:2rem !important;}
.font_s22 { font-size:2.2rem !important;}
.font_s24 { font-size:2.4rem !important;}
.font_s26 { font-size:2.6rem !important;}
.font_s28 { font-size:2.8rem !important;}
.font_s30 { font-size:3.0rem !important;}
.font_s32 { font-size:3.2rem !important;}
.font_s34 { font-size:3.4rem !important;}
.font_s36 { font-size:3.6rem !important;}
.font_s40 { font-size:4.0rem !important;}
.font_s42 { font-size:4.2rem !important;}
.font_s44 { font-size:4.4rem !important;}
.font_s46 { font-size:4.6rem !important;}
.font_s48 { font-size:4.8rem !important;}
.font_s80 { font-size:8.0rem !important;}


.font_fam01{font-family:"Arial"}




/* ---- back ---- */
.back01{ background-color:#FDF8F0 !important}/* ---- 黄色背景 ---- */
.back02{ background-color:#FDF8F0 !important}/* ---- 黄色背景 ---- */
.back03{ background-color:#AAAAAA !important}/* ---- グレー背景 ---- */
.back04{ background-color:#E95E61 !important}/* ---- 濃いピンク背景 ---- */
.back05{ background-color:#8EBAC4 !important}/* ---- 濃いグリーン背景 ---- */
.back06{ background-color:#356FA1 !important}/* ---- 濃い青背景 ---- */

.back_image01{ background:url(image/common/back01.jpg) repeat center; }/* ---- 木背景 ---- */
.back_image02{ background:url(image/common/back02.png) repeat center; }/* ---- 布背景 ---- */

.back_green{ background-color:#E9F2F3 !important}/* ---- 薄いグリーン背景 ---- */
.back_pink{ background-color:#FFF9F9 !important}/* ---- 薄いピンク背景 ---- */
.back_blue{ background-color:#E7EFF8 !important}/* ---- 薄いブルー背景 ---- */


.back_shadow{box-shadow: 0 0 6px rgba(0,0,0,0.2);}


/* ---- color ---- */

.white{ color:#fff !important}
.yellow{ color:#FEF000 !important}
.gray{ color:#AAAAAA !important}
.gray02{ color:#444444 !important}
.pink{ color:#E95E61 !important}
.blue{ color:#356FA1 !important}
.blue02{ color:#8EBAC4 !important}
.red{ color:#CC1A1F !important}
.green{ color:#85B3BE !important}


/* ---- hover ---- */

.hover_o:hover{opacity:0.7}
.hover_o{
	opacity:1;
    -webkit-transition: 0.1s linear;
    -moz-transition: 0.1s linear;
    transition: 0.1s linear;
}

.hover_back{
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.hover_c:hover{ color:#627433}
.hover_l:hover{text-decoration:underline}




/* ------ width ------ */

.w300{width:300px;}
.w400{width:400px;}


/* ---- image ---- */
.w100_auto{width:100%; height:auto ; display:block}

.img440{ height:auto; width:100%;max-width:440px;}
.img500{ height:auto; width:100%;max-width:500px;}
.img320{ height:auto; width:100%;max-width:320px;}



/* ---- other ---- */

.over_h{overflow:hidden}
.margin_a{margin:auto}
.display_b{display:block !important}


.abimage{position:absolute}
.position_r{ position:relative}


/* ---- border ---- */

.border_bn{border-bottom:none !important}
.border_tn{border-top:none !important}




/*-----------------------------------------------
ブラウザ調整
-------------------------------------------------*/	

/*PCで効かせる*/
.pc_d{display:block}

/*PCとタブレットだけ*/
.pctb_d{display:block}


.o1024_d{display:block}
.o1280_d{display:block}
.o1366_d{display:block}
.o1440_d{display:block}
.o1680_d{display:block}



/*PCでは効かせない指示*/

.tb_d{display:none}
.tbv_d{display:none}
.tbs_d{display:none}

.sp_d{display:none}
.mo_d{display:none}


.u1280_d{display:none}
.u1366_d{display:none}
.u1440_d{display:none}
.u1600_d{display:none}





/*-----------------------------------------------
全ページで使うclass
-------------------------------------------------*/	

.block1000{max-width:1000px; width:100%; margin:auto}
.block1100{max-width:1100px; width:100%; margin:auto}
.block1200{max-width:1200px; width:100%; margin:auto}


.single_section{padding-top:40px !important}
.section_style01{padding:0 0 80px 0}
.section_style02{padding:0 0 120px 0}/*一番下*/

.section_in{padding-top:80px; padding-bottom:80px}



.title_style01{font-size:2.4rem; margin-bottom:20px}/*タイトル*/


.text_style01{line-height:170%}/*文章*/
.text_style02{line-height:170%; text-align:center}/*お問い合わせなど文章*/
.text_style03{line-height:190%; text-align:center}/*TOP　ビジョンなど*/


.box_border01{ border:3px solid #DDDDDD; padding:4%; background-color:#fff}
.box_border02{ border:3px solid #F6DE64; padding:4%; background-color:#fff}

.page_title01 {
    text-align: center;
    margin: 140px auto 60px auto;
}

.page_title01 :is(h1,:where(.hx1)) img{ height:auto; width:100%;max-width:500px;}


/*ページ中間共通タイトル　ベビポップ+英字 */
	
.title01{ text-align:center; margin-bottom:30px} 
.title01 p{margin-top:10px}



/*共通タイトル 白のフキダシ */


.hukidashi01_white:before {
    background: url(image/common/hukidashi_wl.png) no-repeat center;
}


.hukidashi01_white:after {
    background: url(image/common/hukidashi_wr.png) no-repeat center;
}



/*共通リストスタイル*/


.listStyle01{ width:97%;}

.listStyle01 dl {
    overflow: hidden;
    width: 100%;
    padding: 10px 0;
}

.listStyle01 dl:nth-child(odd){background-color:#EAE9E8}
.listStyle01 dt{ float:left; width:15%; margin-left:2%; font-size:1.4rem}
.listStyle01 dd{ float:left; width:81% ; margin-right:2%; font-size:1.4rem}




/*transform01(=aタグ)ホバーで、画像拡大*/


.figure01{ overflow:hidden}
.figure01 img {
    -moz-transition: -moz-transform .4s ease;
    -webkit-transition: -webkit-transform .4s ease;
    -o-transition: -o-transform .4s ease;
    -ms-transition: -ms-transform .4s ease;
    transition: all 0.4s ease 0s;
	opacity:1;
	display:block;
	width:100%;
	height:auto;
}


.transform01:hover .figure01 img {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
	opacity:0.8
}


.transform01{position:relative; display:block; width:100%; overflow:hidden; background-color:#333}


/*transform02(=aタグ)ホバーで、背景画像拡大*/

.transform02{
	background-size: cover;
	transition: all 0.5s ease-out;
	transform: matrix3d(
		1, 0, 0, 0,
		0, 1, 0, 0,
		0, 0, 1, 0,
		0, 0, 0, 1
	);
	will-change: transform;
}

.transform02:hover {
	transform: matrix3d(
		1, 0, 0, 0,
		0, 1, 0, 0,
		0, 0, 1, 0,
		0, 0, 0, 0.9
	);
}


/*マウスオンでアイコン拡大*/

.transform_image {
	display: block;
	transition-duration: 0.3s;	/*変化に掛かる時間*/
	margin:auto
}
.transform_image:hover {
	transform: scale(1.1);	/*画像の拡大率*/
	transition-duration: 0.3s;	/*変化に掛かる時間*/
}


/*ページネーション（No表示)*/

#pagenation {
    clear: both;
    text-align: center;
    margin-top: 60px;
    padding: 30px 0;
}

#pagenation .page-numbers {
    padding: 6px 14px;
    font-weight: bold;
    background-color: #fff;
    -webkit-transition: 0.1s linear;
    -moz-transition: 0.1s linear;
    transition: 0.1s linear;
    margin: 0 5px;
	border:2px solid #AAAAAA;
	color:#AAAAAA
}

.next.page-numbers , .prev.page-numbers{display:none}

#pagenation a:hover , #pagenation .current{background-color:#356FA1; color:#fff; border:2px solid #356FA1;}



#pagenation02{}


/*ページネーション（リスト+next+prev)*/


#pagenation02{position:relative}

.page_next a, .page_prev  a{
    width: 240px;
    padding: 12px 0;
    text-align: center;
    background: #F4D63D;
    vertical-align: baseline;
    display: block;
    color: #444444;
	height:52px;
	box-shadow:4px 4px 0px -1px #666666;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}


/*Nextボタン*/

.page_next {
    position: absolute;
    right: 0;
	top:0
}


/*Prevボタン*/
.page_prev {
    position: absolute;
    left: 0;
	top:0
}


.page_list:hover , .page_prev:hover a , .page_next:hover a{ background-color:#FEF000}



/*共通ホバーボタン*/

.btn01 {
    width: 340px;
    /* padding: 12px 0; */
    text-align: center;
    background: #F4D63D;
    vertical-align: baseline;
    display: block;
    margin: auto;
    color: #444444;
    height: 52px;
    box-shadow: 4px 4px 0px -1px #666666;
    display: table;
}
.btn01 > p{ display:table-cell; vertical-align:middle; margin:auto; color:inherit}
.btn01:hover { background-color:#FEF000}


.btn_yazi01 , .btn_yazi02{ position:relative}
.btn_yazi01:after , .btn_yazi02:after {
    content: "";
    background-image: url(image/common/yazi01.png);
    height: 16px;
    width: 25px;
    position: absolute;
    right: 10px;
    background-repeat: no-repeat;
    top: 35%;
    bottom: 0;
    vertical-align: middle;
}


.btn_yazi02:after {
    content: "";
    background-image: url(image/common/yazi02.png);
}


.btn02 {
    width: 600px;
    padding: 30px 0;
    text-align: center;
    background: #F4D63D;
    vertical-align: baseline;
    display: block;
    margin: auto;
    color: #444444;
    height: 80px;
    box-shadow: 4px 4px 0px -1px #666666;
}
.btn02:hover { background-color:#89C9B9}



/*タグ*/


.common_tag { color:#fff; padding:2px 5px}
.tag_navy{background-color:#08233E}
.tag_orange{background-color:#DD6400}
.tag_yellow{background-color:#CDA400}






/* ---- inview ---- */

.inview01{
	opacity:0;
	transform: translate(0,20px); /*移動距離*/
	-webkit-transform: translate(0,20px); 
	-moz-transform: translate(0,20px);
	-o-transform: translate(0,20px);
	transition: all 0.9s;/*変化時間*/
    -webkit-transition: all 0.9s;
	-moz-transition: all 0.9s;
	-o-transition: all 0.9s;
}


.inview02{
	opacity:0;
	transform: translate(0,30px); /*移動距離*/
	-webkit-transform: translate(0,30px); 
	-moz-transform: translate(0,30px);
	-o-transform: translate(0,30px);
	transition: all 0.9s;/*変化時間*/
    -webkit-transition: all 0.9s;
	-moz-transition: all 0.9s;
	-o-transition: all 0.9s;
}


.inview03{
	opacity:0;
	transform: translate(0,50px); /*移動距離*/
	-webkit-transform: translate(0,50px); 
	-moz-transform: translate(0,50px);
	-o-transform: translate(0,50px);
	transition: all 0.9s;/*変化時間*/
    -webkit-transition: all 0.9s;
	-moz-transition: all 0.9s;
	-o-transition: all 0.9s;
}





/*変化後*/

.fade_b{
	opacity: 1.0;
	transform: translate(0,0); 
	-webkit-transform: translate(0,0);
}



.ie_d{display: none}