/* === GENERAL === */

body { font-family: arial,helvetica,sans-serif; font-size: 16px; margin: 0; padding: 0; }

a, a:visited { color: #31708f; text-decoration: none; outline: none; }

caption { color: #777; padding: 8px 0; text-align: left; }

h1,h2,h3 { font-family: Present,sans-serif; font-weight: 700; margin: 0; padding: 0; }
h4,h5,h6 { font-family: Fort,sans-serif; font-weight: 500; margin: 0; padding: 0; }

h1 { font-size: 50px; }
h2 { font-size: 30px; }
h3 { font-size: 28px; }
h4 { font-size: 24px; }
h5 { font-size: 20px; }
h6 { font-size: 16px; }
@media (max-width: 575px) { h1 { font-size: 40px; } }

iframe { border: none; overflow: hidden; }

img { border: none; border-style: none; }

p { margin: 0 0 12px; }

.text-left { text-align: left; }
.text-right { text-align: right; }
.text-center { text-align: center; }
.text-justify { text-align: justify; }


/* === HEADER === */

header.navbar { background-color: #fff; box-shadow: 0 2px 5px rgba(0,0,0,0.5); height: 64px; left: 0; position: fixed; top: 0; width: 100%; z-index: 11; }
header.navbar a { color: #000; }
header.navbar nav { background-color: #fff; height: 64px; position: relative; width: 100%; z-index: 12; }
header.navbar nav .logo { color: #555; font-family: Present,arial,helvetica,sans-serif; font-size: 36px; font-weight: 700; height: 64px; left: 20px; line-height: 64px; position: absolute; top: 0; }
header.navbar nav .logo img { margin-right: 8px; vertical-align: -12px; }
header.navbar nav ul.menu { list-style-type: none; margin: 0 0 0 280px; padding: 0 10px; text-align: left; }
header.navbar nav ul.menu li { display: inline-block; }
header.navbar nav ul.menu li a { color: #000; display: inline-block; height: 64px; line-height: 64px; padding: 0 15px; }
header.navbar nav ul.menu li a:hover { background-color: #ddd; color: #059aff; }
header.navbar nav ul.menu li a.home { background: transparent url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBmaWxsPSIjMDAwMDAwIiBkPSJNMjMuNDc3LDEzLjY1MCBDMjMuMjg2LDEzLjgyNSAyMy4wNDYsMTMuOTEyIDIyLjgwNywxMy45MTIgQzIyLjUzOCwxMy45MTIgMjIuMjcxLDEzLjgwNCAyMi4wNzUsMTMuNTg5IEwyMS44MTUsMTMuMzAzIEwyMS44MTUsMjEuODg1IEMyMS44MTUsMjIuOTg0IDIwLjkyNSwyMy44NzggMTkuODMyLDIzLjg3OCBMMTUuODY1LDIzLjg3OCBDMTUuMzE4LDIzLjg3OCAxNC44NzQsMjMuNDMyIDE0Ljg3NCwyMi44ODEgQzE0Ljg3NCwyMi44MjUgMTQuODk3LDIyLjc3NSAxNC45MDYsMjIuNzIxIEwxNC45MDYsMTUuODc1IEw4LjkyNCwxNS45MDUgTDguOTI0LDIyLjg4MSBDOC45MjQsMjMuNDMyIDguNDgwLDIzLjg3OCA3LjkzMywyMy44NzggTDMuOTY2LDIzLjg3OCBDMi44NzMsMjMuODc4IDEuOTgzLDIyLjk4NCAxLjk4MywyMS44ODUgTDEuOTgzLDEzLjMwMyBMMS43MjMsMTMuNTg5IEMxLjM1MywxMy45OTQgMC43MjUsMTQuMDIyIDAuMzIyLDEzLjY1MCBDLTAuMDgyLDEzLjI3OCAtMC4xMDksMTIuNjQ4IDAuMjYxLDEyLjI0MiBMMTEuMTY4LDAuMjgzIEMxMS41NDQsLTAuMTI5IDEyLjI1NCwtMC4xMjkgMTIuNjMwLDAuMjgzIEwyMy41MzcsMTIuMjQyIEMyMy45MDcsMTIuNjQ4IDIzLjg4MCwxMy4yNzggMjMuNDc3LDEzLjY1MCBaTTE5LjkwNiwxMS4yMTAgTDExLjg5OSwyLjQzMSBMMy45MDYsMTEuMTk1IEwzLjkwNiwyMS44NzUgTDYuOTQxLDIxLjg4MiBMNi45NDEsMTUuOTA1IEM2Ljk0MSwxNC44MDYgNy44MzEsMTMuOTEyIDguOTI0LDEzLjkxMiBMMTQuODc0LDEzLjkxMiBDMTUuOTY4LDEzLjkxMiAxNi44NTcsMTQuODA2IDE2Ljg1NywxNS45MDUgTDE2Ljg1NywyMS44ODIgTDE5LjkwNiwyMS44NzUgTDE5LjkwNiwxMS4yMTAgWiIvPjwvc3ZnPg==") no-repeat center center; background-size: 20px 20px; padding: 0; width: 50px; }
header.navbar nav ul.menu li a.home:hover { background: #ddd url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBmaWxsPSIjMDU5YWZmIiBkPSJNMjMuNDc3LDEzLjY1MCBDMjMuMjg2LDEzLjgyNSAyMy4wNDYsMTMuOTEyIDIyLjgwNywxMy45MTIgQzIyLjUzOCwxMy45MTIgMjIuMjcxLDEzLjgwNCAyMi4wNzUsMTMuNTg5IEwyMS44MTUsMTMuMzAzIEwyMS44MTUsMjEuODg1IEMyMS44MTUsMjIuOTg0IDIwLjkyNSwyMy44NzggMTkuODMyLDIzLjg3OCBMMTUuODY1LDIzLjg3OCBDMTUuMzE4LDIzLjg3OCAxNC44NzQsMjMuNDMyIDE0Ljg3NCwyMi44ODEgQzE0Ljg3NCwyMi44MjUgMTQuODk3LDIyLjc3NSAxNC45MDYsMjIuNzIxIEwxNC45MDYsMTUuODc1IEw4LjkyNCwxNS45MDUgTDguOTI0LDIyLjg4MSBDOC45MjQsMjMuNDMyIDguNDgwLDIzLjg3OCA3LjkzMywyMy44NzggTDMuOTY2LDIzLjg3OCBDMi44NzMsMjMuODc4IDEuOTgzLDIyLjk4NCAxLjk4MywyMS44ODUgTDEuOTgzLDEzLjMwMyBMMS43MjMsMTMuNTg5IEMxLjM1MywxMy45OTQgMC43MjUsMTQuMDIyIDAuMzIyLDEzLjY1MCBDLTAuMDgyLDEzLjI3OCAtMC4xMDksMTIuNjQ4IDAuMjYxLDEyLjI0MiBMMTEuMTY4LDAuMjgzIEMxMS41NDQsLTAuMTI5IDEyLjI1NCwtMC4xMjkgMTIuNjMwLDAuMjgzIEwyMy41MzcsMTIuMjQyIEMyMy45MDcsMTIuNjQ4IDIzLjg4MCwxMy4yNzggMjMuNDc3LDEzLjY1MCBaTTE5LjkwNiwxMS4yMTAgTDExLjg5OSwyLjQzMSBMMy45MDYsMTEuMTk1IEwzLjkwNiwyMS44NzUgTDYuOTQxLDIxLjg4MiBMNi45NDEsMTUuOTA1IEM2Ljk0MSwxNC44MDYgNy44MzEsMTMuOTEyIDguOTI0LDEzLjkxMiBMMTQuODc0LDEzLjkxMiBDMTUuOTY4LDEzLjkxMiAxNi44NTcsMTQuODA2IDE2Ljg1NywxNS45MDUgTDE2Ljg1NywyMS44ODIgTDE5LjkwNiwyMS44NzUgTDE5LjkwNiwxMS4yMTAgWiIvPjwvc3ZnPg==") no-repeat center center; background-size: 20px 20px; padding: 0; width: 50px; }
header.navbar nav label.mobilemenu-icon { background: transparent url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSIwIDAgNTEyIDUxMiI+DQo8cGF0aCBmaWxsPSIjMjMxZjIwIiBkPSJNMTUzLjM3LDIwNC44SDM1OC40NmExNy4wNywxNy4wNywwLDAsMCwwLTM0LjEzSDE1My4zN2ExNy4wNywxNy4wNywwLDAsMCwwLDM0LjEzWiIvPg0KPHBhdGggZmlsbD0iIzIzMWYyMCIgZD0iTTE1My4zNywyNzMuMDdoMjA0LjhhMTcuMDcsMTcuMDcsMCwwLDAsMC0zNC4xNEgxNTMuMzdhMTcuMDcsMTcuMDcsMCwwLDAsMCwzNC4xNFoiLz4NCjxwYXRoIGZpbGw9IiMyMzFmMjAiIGQ9Ik0zNTguNzEsMzA3LjIsMTUzLjQxLDMwN2gwYTE3LjA3LDE3LjA3LDAsMCwwLDAsMzQuMTNsMjA1LjMxLjE3aDBhMTcuMDcsMTcuMDcsMCwwLDAsMC0zNC4xM1oiLz4NCjxwYXRoIGZpbGw9IiMyMzFmMjAiIGQ9Ik00MDkuMzYsMzQxLjMzYTUxLjI2LDUxLjI2LDAsMCwxLTUxLjE5LDUxLjJIMTUzLjM3YTUxLjI3LDUxLjI3LDAsMCwxLTUxLjItNTEuMlYxNzAuNjdhNTEuMjcsNTEuMjcsMCwwLDEsNTEuMi01MS4yaDIwNC44YTUxLjI2LDUxLjI2LDAsMCwxLDUxLjE5LDUxLjJabS01MS4xOS0yNTZIMTUzLjM3QTg1LjQzLDg1LjQzLDAsMCwwLDY4LDE3MC42N1YzNDEuMzNhODUuNDMsODUuNDMsMCwwLDAsODUuMzMsODUuMzRoMjA0LjhhODUuNDMsODUuNDMsMCwwLDAsODUuMzMtODUuMzRWMTcwLjY3QTg1LjQzLDg1LjQzLDAsMCwwLDM1OC4xNyw4NS4zM1oiLz4NCjwvc3ZnPg==") no-repeat center center; background-size: contain; cursor: pointer; display: inline-block; height: 44px; margin: 10px; position: absolute; right: 0; top: 0; width: 44px; }
header.navbar .mobilemenu { background-color: #1f2532; left: 0; max-height: 0; overflow: hidden; position: absolute; top: 64px; transition: max-height 0.5s linear; visibility: hidden; width: 100%; will-change: height, max-height; z-index: 12; }
header.navbar .mobilemenu ul { border-top: 1px solid #111; list-style: none; margin: 0; padding: 0; }
header.navbar .mobilemenu ul li { border-top: 1px solid #2f3542; border-bottom: 1px solid #111; text-align: left; padding: 0 20px; }
header.navbar .mobilemenu ul li a { display: block; padding: 16px 0; }
header.navbar .mobilemenu ul li a, header.navbar .mobilemenu ul li a:visited { color: #fff; }
@media all and (max-width: 900px) { header.navbar nav ul.menu { display: none; } }
header.navbar .mobilemenu-checkbox { margin: 0; opacity: 0; padding: 0; position: absolute; right: -20px; top: 0; }
header.navbar #mobilemenu-overlay { background-color: rgba(0,0,0,0.98); height: 100vh; display: none; position: absolute; width: 100vw; z-index: 10; }
header.navbar #mobilemenu-button:checked ~ #mobilemenu-overlay { display: block; }
header.navbar #mobilemenu-button:checked ~ .mobilemenu { max-height: 1000px; visibility: visible; }
header.navbar .google-auto-placed { display: none; }


/* === FOOTER === */

footer { background-color: #f5f5f5; margin: 60px 0 0; }
footer .footer-bottom { font-size: 12px; height: 40px; line-height: 40px; text-align: center; }


/* === LAYOUT === */

.container { margin: 0 auto; padding: 0 20px; }
@media (max-width: 575px) { .container { padding: 0 10px; } }
@media (min-width: 576px) { .container { width: auto; } }
@media (min-width: 768px) { .container { width: auto; } }
@media (min-width: 992px) { .container { width: 940px; } }
@media (min-width: 1200px) { .container { width: 1140px; } }
main { background: #ffefde url("https://ashidakim.com/zenkoans/zen_bg.gif"); }


/* === BREADCRUMBS === */

ul.breadcrumbs { list-style-type: none; margin: 0 0 20px; padding: 0; text-align: center; }
ul.breadcrumbs li { display: inline-block; }
ul.breadcrumbs a:active, ul.breadcrumbs a:hover { text-decoration: underline; }


/* === HERO === */

.hero { background-color: #8b729f; margin-top: 60px; padding: 20px 0; }
/* ede9ea fdf9fa 8b829f */
.hero-banner { background-size: contain; height: 240px; }
.hero-banner.zenkoans { background: #c7bab2 url("https://ashidakim.com/images/banners/zenkoans-banner-full.jpg") no-repeat center center; }
@media (max-width: 1199px) { .hero-banner.zenkoans { background-image: url("https://ashidakim.com/images/banners/zenkoans-banner-1200.jpg"); } }
@media (max-width: 575px) { .hero-banner.zenkoans { background-image: url("https://ashidakim.com/images/banners/zenkoans-banner-600.jpg"); } }
.hero-content { background-color: #fff; box-shadow: 0 3px 7px 1px rgba(0,0,0,0.12); margin: -170px auto 0; max-width: 820px; padding: 30px 15px; text-align: center; width: auto; }
@media (max-width: 575px) { .hero-content { margin: -150px auto 0; } }
.hero-content .hero-hdr { border-bottom: 2px solid #f60; display: inline-block; font-family: Fort,sans-serif; font-size: 20px; font-weight: 400; margin: 20px auto; padding-bottom: 3px; }
@media (max-width: 575px) { .hero-content .hero-hdr { margin: 0 auto 20px; } }
.hero-content h1 { margin: 0 auto; max-width: 780px; }
.hero-content h2 { font-family: Fort,sans-serif; font-size: 20px; font-weight: 300; line-height: 28px; margin: 22px auto 11px; }


/* === CONTENT === */

.bamboo { padding-top: 80px; text-align: center; }
.bamboo img { max-width: 100%; }
.content { margin-bottom: 80px; padding: 20px 0 40px; }
.overview { color: #333; line-height: 1.4; margin-bottom: 20px; padding-top: 40px; text-align: justify; }
.overview a { text-decoration: underline; }
.main { background-color: #fff; border: 2px solid #000; border-radius: 8px; color: #333; line-height: 1.2; overflow: hidden; padding: 24px 30px; }
@media (max-width: 575px) { .main { padding: 24px 20px; } }
.main h4 { color: #000; font-size: 20px; margin-bottom: 15px; }
.main p:first-of-type { text-indent: 1em; }
.main p.break { margin: 0 0 14px; }
.main p.noindent { text-indent: 0; }
.main p.triangle { margin: 0 0 2px; text-align: center; text-indent: 0; }
.main .indent { margin: 0 0 12px 48px; }
.main .indent p { font-style: italic; margin: 0; text-indent: 0; }
.main .indent p.break { margin: 0 0 5px; }
.main .indent .sig { margin-left: 168px; }
.main .emphasis { margin-bottom: 12px; }
.main .emphasis p { font-style: italic; margin: 0; text-indent: 0; }
.main .emphasis .sig { margin: 12px 0 12px 168px; }
@media (max-width: 400px) { .main .indent { margin: 0 0 12px 18px; } .main .indent .sig { margin-left: 140px; } .main .emphasis .sig { margin: 12px 0 12px 140px; } }
@media (max-width: 330px) { .main .indent .sig { margin-left: 120px; } .main .emphasis .sig { margin: 12px 0 12px 120px; } }
ul.zenkoanlist { column-gap: 40px; column-width: 260px; line-height: 1.4; list-style-type: none; margin: 0; padding: 0; }
ul.zenkoanlist li { padding: 2px 0; }
ul.zenkoanlist a:active, ul.zenkoanlist a:hover { text-decoration: underline; }


/* === TAGS === */

.tag-area { display: flex; flex-wrap: wrap; justify-content: space-between; margin: 0 auto; max-width: 940px; }
.tag-area a, .tag-area a:visited { border: 1px solid #b5b5b5; border-radius: 6px; color: #000; font-family: Fort,sans-serif; font-size: 16px; font-weight: 500; margin: 0 10px 10px 0; padding: 10px 16px; text-align: center; text-decoration: none; }
.tag-area a:active, .tag-area a:hover { background-color: #e6e6e6; }
@media (max-width: 767px) { .tag-area a { margin: 0 0 10px 0; width: 100%; } }
