@charset "utf-8";
/*------------------------  fairtrade.css  ------------------------*/



/*-----  main-visual  -----*/
.main-visual { margin: 10px 0 50px; }

@media screen and (max-width: 800px) {
 .main-visual { margin: 0 0 25px; }
}


/*-----  action  -----*/
.action { margin: 0 0 50px; }
.action .action-block { padding: 30px 34px 40px; }
.action .action-block .head { padding: 0 0 18px; border-bottom: 1px solid #dfc29d; font-weight: 800; font-size: 28px; line-height: 1.3; }
.action .action-block .txt { padding: 25px 0 0; font-size: 16px; line-height: 1.8; }
.action .action-block .txt sup { font-size: 14px; line-height: 1; }
.action .action-block .note { padding: 22px 0 0; font-size: 15px; line-height: 1.6; }

@media screen and (max-width: 800px) {
 .action { margin: 0 0 25px; }
 .action .action-block { padding: 18px 5% 25px; }
 .action .action-block .head { padding: 0 0 12px; font-size: 20px; }
 .action .action-block .txt { padding: 18px 0 0; font-size: 15px; }
 .action .action-block .txt sup { font-size: 13px; }
 .action .action-block .note { padding: 15px 0 0; font-size: 14px; }
}


/*-----  story  -----*/
.story { display: flex; flex-wrap: wrap; margin: 0 -10px 20px; }
.story .first-block { flex-basis: 100%; padding: 0 10px 25px; }
.story .first-block .first { display: flex; justify-content: center; background: url(/images/fairtrade/bg_beans.jpg) center; background-size: cover; }
.story .first-block .first .adjust { padding: 0 5px; width: 50%; }
.story .story-block { flex-basis: calc(100%/2); padding: 0 10px 25px; }

@media screen and (max-width: 800px) {
 .story { display: block; margin: 0 0 15px; }
 .story .first-block { padding: 0 0 18px; }
 .story .first-block .first { display: block; background: none; }
 .story .first-block .first .adjust { padding: 0; width: auto; }
 .story .story-block { padding: 0 0 18px; }
}


/*-----  fairtrade-btn  -----*/
.fairtrade-btn { width: 340px; margin: 0 auto; }
.fairtrade-btn .btn { height: 60px; font-size: 17px; }
.fairtrade-btn .btn::after { right: 30px; }

@media screen and (max-width: 800px) {
 .fairtrade-btn { width: auto; }
 .fairtrade-btn .btn { height: 50px; font-size: 15px; }
 .fairtrade-btn .btn::after { right: 22px; }
}



