@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New:wght@500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200');

html, body, div, span,
h1, h2, h3, h4, h5, h6, p,
b, i, dl, dt, dd, ol, ul, li,
footer, header {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

ul,ol { list-style-type: none;}

p { margin: 0;}

img { border: 0; vertical-align: bottom; width: 100%;}

a { color: #433631; text-decoration: none;}

a:hover img { opacity: 0.8; filter: alpha(opacity=80); -ms-filter: "alpha(opacity=80)";}


#Coony {
    width: 100%;
    font-size: 22px;
    color: #433631;
    background: url("/public/images/default/laetitienpet/coony/coony_back.jpg") center top no-repeat;
    background-size: cover;
    background-attachment: fixed;
    overflow: hidden;
}

@media screen and (max-width:820px) {
#Coony { background: url(none) ;background-color: #bdcfa1;}
}


#Coony .cnt {
    background: #fff;
    width: 600px;
    margin: 0 auto;
    border-right: 15px solid #fff;
    border-left: 15px solid #fff;
    box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.35);
}

#Coony .green { color: #046d5b; font-weight: 700;}

#Coony div,
#Coony h2, #Coony h3, #Coony h4, #Coony h5,
#Coony b, #Coony a,
#Coony p, #Coony span,
#Coony li, #Coony dt,
#Coony dd {
    font-family: "Zen Kaku Gothic New", sans-serif;
    font-feature-settings: "palt";
}

#Coony img { width: 100%; border: 0; vertical-align: bottom;}

/* fv */
.Coonybox_fv { background-color: #f8f6ef;}

/*ボタン*/
.Coonybox_order { padding: 40px 60px 60px; }
.Coonybox_order .note { font-size: 0.7em; margin-top: 0.5em; text-align: left;}

/*Coonybox_Intro*/
.Coonybox_Intro { background: #dee7d0;}
.Intro_txt { padding: 35px 25px; font-size: 25px; line-height: 2em; }
.Intro_about {background-color: #f8f6ef;}
.coonyBox {background-color: #bdcfa1; }

/*coony_illust*/
.coony_illust_txt { padding: 5px 20px 40px; line-height: 2em; font-size: 23px;}


/*coony_box_lineup*/
.coony_box_lineup {background-color: #f2f0e7;}
.lineup_txt { padding: 10px 30px 0; letter-spacing: 0.05em; line-height: 1.8em;}
.lineup_base {padding: 0 20px 20px;}
.lineup_back {background-color: #046d5b; padding-bottom: 20px; border-radius: 0 0 10px 10px;}
.lineup_cnt {background-color: #fff; border-radius: 10px; margin: 0 20px; padding: 20px;}
.lineup_cnt .boxtitle {padding: 30px 0; letter-spacing: -0.03em; }
.coony_box_lineup h4 {font-size: 25px;}
.coony_box_lineup dl { padding: 0 30px 30px; font-size: 0.8em;}
.coony_box_lineup dt { text-align: center; background: #fbe8b1; line-height: 2em;}
.coony_box_lineup dd { padding: 10px 0;}
.coony_box_lineup dd:last-child { padding: 10px 0 0;}
.coony_box_lineup dd.center { text-align: center;}
.coony_box_lineup dd a.close { display: block; text-align: center; margin-top: 0.5em; color: #666; font-size: 0.9em;}
.coony_box_lineup dd a.close:before {
    font-family: 'Material Symbols Outlined';
    content: '\e5cd';
    display: inline-block;
    margin-right: 5px;
    vertical-align: middle;
}
.lineup_cnt .note { font-size: 0.8em; margin-top: 0.3em; text-align: center; padding-bottom: 30px;color: #767676 }
.lineup_cnt .boxtitle_soup {padding: 30px 0 0; letter-spacing: -0.03em;}


/* tgl common */
.tgl .tglDtl { display: none;}
.tgl h4 { position: relative; cursor: pointer;}

.btnTgl { border: 2px solid;}

.btnTgl h4 { text-align: center; font-weight: 600; line-height: 60px; height: 60px;}

.btnTgl h4:after {
    position: absolute;
    top: 0;
    right: 30px;
    font-size: 1.4em;
    font-family: 'Material Symbols Outlined';
    content: '\e313';
    display: inline-block;
}
.btnTgl h4.icnClose:after {
    content: '\e316';
}


/* Coonybox_note */
.Coonybox_note { background: #fff; padding: 30px 40px 60px; font-size: 20px;}
.Coonybox_note h3 { text-align: center; font-weight: 600; font-size: 1.2em; line-height: 60px; height: 60px; margin-bottom: 0.5em;}
.Coonybox_note .note01 li { list-style: circle; margin-left: 1em; line-height: 1.6em;}
.Coonybox_note .tgl:last-of-type { margin-top: 30px;}

#form h3 img, #form .form-btn img { border: 0; vertical-align: bottom; width: auto;}
