@charset "utf-8";
.column2{ display: flex; flex-direction: row; justify-content: space-between; align-items: flex-start;}
/*--------------------
味噌教室
---------------------*/
#miso-school .inner{ padding: 0 3%;}
#miso-school #ttl{align-items: flex-start;}
#miso-school #ttl h1{ padding: 100px 0 75px; font-size: 54px; font-weight: 300;}
#miso-school #ttl .wrap, 
#miso-school .column2{ margin-bottom: 60px;}
#miso-school .column2 dl, 
#miso-school .column2 .box{ width: 45%; display: flex; flex-direction: column;}
#miso-school .column2 dl dt, 
#miso-school .column2 dl dd{ width: 100%; display: block; font-size:28px; line-height: 1.8em; }
#miso-school .column2 dl dt, 
#miso-school .column2 .box p b{ font-weight: 500;}
#miso-school .column2 .box .wrap{ margin-bottom:25px; }
#miso-school .column2 .box p{ width: 100%; display: flex; flex-direction: column;}
#miso-school .column2 .box p b, 
#miso-school .column2 .box p span{ width: 100%; display: block; font-size:20px; line-height: 1.8em; letter-spacing: 0;}
@media screen and (max-width: 950px) {
#miso-school .column2 dl dt, 
#miso-school .column2 dl dd{ font-size:22px;}
#miso-school .column2 .box p b, 
#miso-school .column2 .box p span{ font-size:18px;}
}
@media screen and (max-width: 800px) {
#miso-school .column2{ flex-direction: column;}
#miso-school .column2 dl, 
#miso-school .column2 .box{ width: 100%; margin-bottom: 80px;}
#miso-school .column2{ margin-bottom: 0px;}
}
@media screen and (max-width: 700px) {
#miso-school #ttl h1{ font-size: 48px;}
}
/*--------------------
蔵代のこだわり
---------------------*/
#miso-awase .inner{ padding: 0 3%;}
#miso-awase #ttl{align-items: flex-start; margin-bottom: 60px;}
#miso-awase #ttl h1{ padding: 100px 0 75px; font-size: 54px; font-weight: 300;}
#miso-awase .txt{ width: 100%; display: flex; flex-direction: column; align-items: flex-start;}
#miso-awase .txt h2, 
#miso-awase .txt p{ display: block; font-size: 26px;}
#miso-awase .txt h2{ font-weight: 500; margin-bottom: 15px;}
#miso-awase .txt p{ margin-bottom: 50px; line-height: 1.8em;}
#miso-awase .txt .image{ margin: 20px 0 75px;}
#miso-awase .column2 { margin-bottom: 60px;}
#miso-awase .column2 dl{ width: 45%; display: flex; flex-direction: column;}
#miso-awase .column2 dl dt, 
#miso-awase .column2 dl dd{ width: 100%; display: block; font-size:28px; line-height: 1.8em; }
#miso-awase .column2 dl dt{ font-weight: 500;} 
#miso-awase .column2 dl dd img{ margin: 40px 0;}
@media screen and (max-width: 950px) {
#miso-awase .txt h2, 
#miso-awase .txt p, 
#miso-awase .column2 dl dt, 
#miso-awase .column2 dl dd{ font-size:22px;}
}
@media screen and (max-width: 800px) {
#miso-awase .column2{ flex-direction: column;}
#miso-awase .column2 dl{ width: 100%; margin-bottom: 80px;}
}
@media screen and (max-width: 700px) {
#miso-awase #ttl h1{ font-size: 48px;}
}

/*--------------------
会社概要
---------------------*/
.table-wrap{ margin-bottom: 85px;}
#miso-about .inner{ padding: 0 2%;}
#miso-about #ttl{align-items: flex-start; margin-bottom: 85px;}
#miso-about #ttl h1{ padding: 100px 0 75px; font-size: 54px; font-weight: 300;}
#miso-about #ttl p{ display: block; font-size: 50px; letter-spacing: 1px; line-height: 2em;}
#miso-about table, 
#miso-about table tbody, 
#miso-about table tbody tr{ width: 100%;}
#miso-about table tbody tr > *{ font-size:22px; padding: 10px 25px; border: solid 1px #999; text-align: left;}
#miso-about table tbody tr th{ white-space: nowrap;}
#miso-about table tbody tr td{}
@media screen and (max-width: 1050px) {
#miso-about #ttl p{ font-size: 4.8vw; letter-spacing: 0;}
}
@media screen and (max-width: 900px) {
#miso-about table tbody tr > *{ font-size:18px; padding: 10px 15px;}
}
@media screen and (max-width: 700px) {
#miso-about #ttl h1{ font-size: 48px; padding-bottom: 20px;}
#miso-about #ttl{ margin-bottom: 40px;}
#miso-about table tbody tr > *{ font-size:16px; padding: 10px 15px;}
}
/*--------------------
プライバシーポリシー
---------------------*/
#privacy{ padding-bottom: 40px;}
#privacy .inner{ max-width: 800px; padding: 0 3% 30px; align-items: flex-start;}
#privacy #ttl{align-items: flex-start;}
#privacy #ttl h1{ padding: 100px 0 0; font-size: 30px; font-weight: 300;}
#privacy #ttl p{ padding-left: 0px !important;}
#privacy .inner > *{ width: 100%; display: block; justify-content: flex-start; margin-bottom: 30px; padding-left: 10px;}
#privacy .inner h2{ margin: 20px 0 10px; font-size: 18px; font-weight: 600; padding-left: 10px; border-left: solid 6px #000;}
#privacy .inner p{ font-size: 16px; line-height: 1.6em; font-weight: 400;}
#privacy .inner ul{ display: flex; flex-direction: column; justify-content: flex-start;}
#privacy .inner ul li{ display: block; padding: 6px 0 6px 15px; text-indent: -1em; font-size: 16px; line-height: 1.4em; font-weight: 400;}
#privacy .inner ul li::before{ content: "・";}
#privacy .inner dl{ display: flex; flex-direction: column; width: auto; padding: 10px; border: solid 1px #ccc; border-radius: 6px; margin-left: 10px;}
#privacy .inner dl > *{ font-size: 13px; letter-spacing: 2px; line-height: 1.4em; font-weight: 400;}
#privacy .inner dl dt{ margin-bottom: 8px; font-weight: 600;}


@media screen and (max-width: 600px) {
#privacy #ttl h1{ font-size: 24px;}
#privacy .inner h2{ font-size: 16px;}
#privacy .inner p, 
#privacy .inner ul li{ font-size: 14px;}
#privacy .inner dl > *{ font-size: 12px;}
}










