@charset "utf-8";
/* ------------------------------------------------
 reset css - drop parent style
------------------------------------------------ */
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed,figure, figcaption, footer, header, hgroup,menu, nav, output, ruby, section, summary,time, mark, audio, video { margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display:block}
html { overflow-y: scroll; -webkit-text-size-adjust:100%}
ul, ol { list-style:none}
blockquote , q { quotes:none}
blockquote:before, blockquote:after, q:before, q:after { content:''; content: none}
a:focus { outline:none}
ins { text-decoration:none}
mark { 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; width:100%}
hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0}
button, input, select, textarea { outline:0; -webkit-box-sizing:border-box; box-sizing:border-box; font-size:100%}
input, textarea { background-image: -webkit-linear-gradient(hsla(0,0%,100%,0), hsla(0,0%,100%,0)); -webkit-appearance: none; border-radius:0}
input[type="checkbox"]{ -webkit-appearance: checkbox}
input[type="radio"]{ -webkit-appearance: radio}
button::-moz-focus-inner, input::-moz-focus-inner { border:0; padding:0}
iframe { max-width:100%}
/* ------------------------------------------------
 基本設定　drop child style
------------------------------------------------ */
@font-face {
	font-family: "Noto Sans JP";
  src: url("../fonts/NotoSansJP-Regular-min.woff") format("woff");
  font-weight: normal;
  font-display: swap;
}
@font-face {
	font-family: "Noto Sans JP";
  src: url("../fonts/NotoSansJP-Medium-min.woff") format("woff");
  font-weight: 500;
  font-display: swap;
}
@font-face {
	font-family: "Noto Sans JP";
  src: url("../fonts/NotoSansJP-Bold-min.woff") format("woff");
  font-weight: bold;
  font-display: swap;
}
@font-face {
  font-family: 'design_plus';
  src: url('../fonts/design_plus.eot?v=1.2');
  src: url('../fonts/design_plus.eot?v=1.2#iefix') format('embedded-opentype'),
       url('../fonts/design_plus.woff?v=1.2') format('woff'),
       url('../fonts/design_plus.ttf?v=1.2') format('truetype'),
       url('../fonts/design_plus.svg?v=1.2#design_plus') format('svg');
  font-weight: normal;
  font-display: swap;
}
@font-face {
  font-family: 'footer_bar';
  src: url('../fonts/footer_bar.eot?v=1.2');
  src: url('../fonts/footer_bar.eot?v=1.2#iefix') format('embedded-opentype'),
       url('../fonts/footer_bar.woff?v=1.2') format('woff'),
       url('../fonts/footer_bar.ttf?v=1.2') format('truetype'),
       url('../fonts/footer_bar.svg?v=1.2#footer_bar') format('svg');
  font-weight: normal;
  font-display: swap;
}
@font-face {
  font-family: 'tiktok_x_icon';
  src: url('../fonts/tiktok_x_icon.eot?v=1.1');
  src: url('../fonts/tiktok_x_icon.eot?v=1.1#iefix') format('embedded-opentype'),
       url('../fonts/tiktok_x_icon.woff?v=1.1') format('woff'),
       url('../fonts/tiktok_x_icon.ttf?v=1.1') format('truetype'),
       url('../fonts/tiktok_x_icon.svg?v=1.1#tiktok_x_icon') format('svg');
  font-weight: normal;
  font-display: swap;
}

*, ::before, ::after { box-sizing: border-box}
body { font-family: 'Noto Sans JP', sans-serif; font-size:14px; line-height:1; width:100%; position:relative; -webkit-font-smoothing:antialiased}
a { color: #333; text-decoration:none}
a, a:before, a:after, input {
  -webkit-transition-property:background-color, color; -webkit-transition-duration:0.2s; -webkit-transition-timing-function:ease;
  transition-property:background-color, color; transition-duration:0.2s; transition-timing-function:ease;
}
/* レイアウト */
#sa-common { position:relative; height:100%; overflow: hidden}
/* ------------------------------------------------
　ヘッダー drop parent・child style
------------------------------------------------ */
#header { position:absolute; width:100%; height:70px; border-bottom:1px solid rgba(255,255,255,0.3); z-index: 999}
.use_header_fix #header { position:fixed; top:0px; left:0px; background:rgba(0,0,0,0.8); border:none}
.use_header_fix #header:after { position:absolute; top:-70px; left:0px; content:''; display:block; width:100%; height:70px; background:#000; transition: all 0.6s cubic-bezier(0.22, 1, 0.36, 1) 0s; z-index:1}
#header.active:after { top:0px}
.pc body.header_fix #header { position:fixed; top:0px; left:0px}
.pc body.header_fix #header:after { top:0px !important}
/* ロゴ */
#header_logo { z-index:10; position:absolute; left:30px; top:50%; transform: translateY(-50%)}
#header_logo .logo { line-height:1; margin:0; padding:0; font-weight:500; display:block}
#header_logo img { display:block; transition: opacity 0.3s ease-in-out}
#header_logo img:hover { opacity:0.5}
#header_logo .logo_image.mobile { display:none}#header_slider_wrap { height: 357px!important}
#header_slider_wrap .bg_image { background-size: 100% auto!important}
/* 検索フォーム */
#header_search { position:absolute; right:0px; top:0px; width:70px; height:70px; z-index:100}
#header_search_button { display:block; position:relative; width:70px; height:70px; cursor:pointer}
#header_search_button:before { display:block; font-family:'design_plus'; color:#fff; font-size:18px; content:'\e915'; top:28px; left:27px; position:absolute; transition: all 0.2s ease}
#header_search_button:hover:before { opacity:0.5}
#header_search form { opacity:0; pointer-events:none; height:110px; width:390px; padding:30px; position:absolute; right:0px; transition: all 0.3s ease}
#header_search.active form { opacity:1; pointer-events:initial}
#header_search .input_area input { position:absolute; right:30px; width:0px; height:50px; border:none; background:none; background:#eee; z-index:1; padding:0 15px; border-radius:50px; transition: all 0.3s ease}
body.header_fix #header_search .input_area input { box-shadow:0 0 0px 3px rgba(0,0,0,0.1)}
#header_search.active form .input_area input { width:330px}
#header_search .button { display:none}
/* グローバルメニュー */
body.hide_global_menu #global_menu { display:none}
#global_menu { width:100%; height:70px; z-index:2; position:relative}
#global_menu > ul { position:relative; text-align:center; font-size:0}
#global_menu > ul > li { display:inline-block; n:relative; line-height:1; text-align:center; font-size:14px}
#global_menu > ul > li > a { color:#fff; font-weight:600; text-decoration:none; height:70px; line-height:70px; padding:0 20px; display:block; position:relative; overflow:hidden}
#global_menu ul ul { display:none; width:230px; position:absolute; top:70px; margin:0; padding:0; z-index:100}
#global_menu ul ul ul { left: 100%; top:0 !important; margin:0}
#global_menu ul ul li { line-height:1.5; font-size:14px; padding:0; margin:0; text-align:left; position:relative; display:block}
#global_menu ul ul a { background:#000; color:#fff !important; display:block; position:relative; padding:14px 20px 12px; height:auto; line-height:1.6; margin:0}
#global_menu ul ul a:hover { text-decoration:none; background:#444}
#global_menu > ul > li.current-menu-item > a { color:#fff}
#global_menu > ul > li.current-menu-item > a:before { top:0}
#global_menu ul ul li.menu-item-has-children > a:before { font-family:'design_plus'; content:'\e910'; color:#fff; display:block; position:absolute; right:9px; top:19px; font-size:10px}
#drawer_menu { display:none}
body.home #global_menu > ul > li.current-menu-item > a { color:#fff}
#global_menu > ul > li > a:hover, #global_menu > ul > li.current-menu-item > a, body.home #global_menu > ul > li.current-menu-item > a:hover, #global_menu > ul > li.active > a { color:#666}
#global_menu ul ul a { background:#666}
#global_menu ul ul a:hover { background:#333; opacity: 1!important}
#footer_message { font-size:18px}
#copyright { color:#fff; background:#222}
/* ------------------------------------------------
　responsive.cssから移植
------------------------------------------------ */
/* -----------------------
 基本設定
----------------------- */
@media screen and (max-width:1151px) {
#container { position:relative; height:100%}
}
/* ドロワーメニュー */
@media screen and (max-width:1151px) {
  #drawer_menu { position:fixed; top:0px; right:-400px; display:block; width:400px; height:100%; overflow:auto; background:#333; z-index:9999; transition:right 300ms cubic-bezier(0.190, 1.000, 0.220, 1.000); backface-visibility: hidden; -webkit-overflow-scrolling: touch}
  .open_menu #drawer_menu { right:0; box-shadow:-5px 0 20px 0 rgba(0,0,0,0.4)}
}
@media screen and (max-width:500px) {
  #drawer_menu { right:-80%; width:80%}
}
/* ドロワーメニュー展開時のオーバーレイ */
@media screen and (max-width:1151px) {
  .open_menu #container:before { content:''; display:block; width:100%; height:100%; position:fixed; top:0px; left:0px; background:rgba(0,0,0,0.6); z-index:9999}
}
/* safariとedgeのみ背景をぼかす */
@media screen and (max-width:1151px) {
  _::-webkit-full-page-media, _:future, :root .open_menu #container:before { background:rgba(0,0,0,0.6); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); }
  @supports (-ms-ime-align: auto) {
    .open_menu #container:before { background:rgba(0,0,0,0.6); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); }
}
/* ドロワーメニューのスクロールバー */
#drawer_menu .simplebar-scrollbar:before { background:#fff !important; }
}
/* -----------------------
 ヘッダー
----------------------- */
@media screen and (max-width:1151px) {
  #header { height:60px; webkit-box-sizing:border-box; box-sizing:border-box}
  .use_mobile_header_fix #header { position:fixed; top:0px; left:0px; background:rgba(0,0,0,0.8); border:none}
  .use_mobile_header_fix #header:after { content:''; position:absolute; top:-60px; left:0px; display:block; width:100%; height:60px; background:#000; transition: all 0.6s cubic-bezier(0.22, 1, 0.36, 1) 0s; z-index:1}
  .mobile body.header_fix_mobile #header { position:fixed; top:0px; left:0px}
  .mobile body.header_fix_mobile #header:after { top:0px !important}
}
/* ロゴ */
@media screen and (max-width:1151px) {
  #header_logo { left:20px}
  #header_logo .logo_image.pc { display:none}
  #header_logo .logo_image.mobile { display:block}
}
@media screen and (max-width:750px) {
  #index_header_logo .logo_image.mobile { display:block}
  #index_header_logo .logo_image.pc { display:none}
}
/* メニューボタン */
@media screen and (max-width:1151px) {
  .global_menu_button { display:inline-block; position:absolute; right:0px; bottom:0px; width:60px; height:60px; font-size:11px; line-height:60px; text-decoration:none; text-align:center; z-index:50}
  .global_menu_button span { position:absolute; display:block; width:22px; height:2px; background:#fff; transition-property:background-color; transition-duration:0.2s; transition-timing-function:ease; transition: all 0.3s ease}
  .global_menu_button span:nth-child(1) { top:24px; left:20px}
  .global_menu_button span:nth-child(2) { top:30px; left:20px}
  .global_menu_button span:nth-child(3) { top:36px; left:20px}
  .global_menu_button:hover span { opacity:0.5}
}
/* グローバルメニュー */
@media screen and (max-width:1151px) {
  #header #global_menu { display:none}
  #mobile_menu { width:100%; margin:0}
  #mobile_menu ul { margin:0; }
  #mobile_menu li ul { display:none}
  #mobile_menu a { overflow:hidden; position:relative; display:block; margin:0; padding:0 60px 0 20px; height:60px; line-height:60px; color:#fff; font-size:13px; text-decoration:none; white-space:nowrap; border-bottom:1px solid #ddd; text-overflow:ellipsis; visibility:visible}
  #mobile_menu a:hover { color:#fff}
  #mobile_menu ul ul a { padding-left:32px}
  #mobile_menu ul ul ul a { padding-left:47px}
  #mobile_menu ul ul ul ul a { padding-left:60px}
}
/* グローバルメニュー（子メニュー） */
@media screen and (max-width:1151px) {
  #mobile_menu li { position:relative}
  #mobile_menu .child_menu_button { display:block; position:absolute; right:0px; top:-1px; width:60px; height:60px; text-align:center; cursor:pointer; z-index:9}
  #mobile_menu .child_menu_button .icon:before { font-family:'design_plus'; content:'\e90e'; display:block; position:absolute; right:24px; top:29px; color:#fff; font-size:12px; text-align:center}
  #mobile_menu .child_menu_button.active .icon:before, #mobile_menu .child_menu_button:hover .icon:before { color:#fff; border-color:#fff}
  #mobile_menu li.open > .child_menu_button .icon:before { content:'\e911'}
  #mobile_menu .child_menu_button:hover { background:rgba(0,0,0,0.2)}
}
/* ヘッダー・フッター　検索フォーム */
@media screen and (max-width:1151px) {
  #header_search { display:none}
  #footer_search { max-width:300px; height:45px; position:relative; overflow:hidden; background:rgba(255,255,255,0.2); margin:30px auto}
  #footer_search .input_area input { position:absolute; left:0px; top:0px; width:calc(100% - 45px); color:#fff; height:45px; padding:0 10px; border:none; background:none; z-index:1}
  #footer_search:hover .input_area input, #footer_search.active .input_area input { left:0px}
  #footer_search .button input { position:absolute; right:0px; width:45px; height:45px; background:none; border:none; pointer-events:none; z-index:2}
  #footer_search .button label { pdisplay:block; position:absolute; top:0px; right:0px; width:45px; height:45px; background:none; cursor:pointer; z-index:2}
  #footer_search .button label:before { display:block; position:relative; top:16px; left:16px; font-family:'design_plus'; color:#fff; font-size:18px; content:'\e915'; transition: all 0.2s ease; z-index: 2}
  #footer_search .button label:hover:before { color:#0b8a97}
  #footer_search input[type=submit] { color: #858585; z-index: 0}
}
@media screen and (max-width:450px) {
  #footer_search { margin:30px 20px}
}
/* ------------------------------------------------
 responsive.css相殺追記
------------------------------------------------ */
@media screen and (max-width:1151px) {
  #drawer_menu { background:#666}
  #drawer_menu a { color:#fff}
  #drawer_menu a:hover { color:#333}
  #mobile_menu a { background: #666; border-color:#444}
  #mobile_menu li li a { background:#333}
  #mobile_menu a:hover, #drawer_menu .close_button:hover, #mobile_menu .child_menu_button:hover { color:#fff; background:#333}
  #mobile_menu .child_menu_button .icon:before, #mobile_menu .child_menu_button:hover .icon:before { color:#fff}
}
/* ------------------------------------------------
 フッター
------------------------------------------------ */
/* フッターロゴ */
#footer_bottom { height:100px; position:relative}
#footer_logo { z-index:3; position:absolute; left:40px; top:50%; transform: translateY(-50%)}
#footer_logo .logo { line-height:1; margin:0; padding:0; font-weight:500; display:block}
#footer_logo img { height:auto; display:block; margin:auto; transition: opacity 0.35s ease-in-out}
#footer_logo img:hover { opacity:0.5}
#footer_logo .logo_image.mobile { display:none}
#footer_logo .logo_text { transition: color 0.35s ease}
/* SNSボタン（ヘッダーも共通） */
#footer_sns { position:absolute; right:30px; top:42px; z-index:3}
.sns_button_list { font-size:0; z-index:20; text-align:center}
.sns_button_list li { display:inline-block; margin:0 5px; position:relative}
.sns_button_list li a { display:block; overflow:hidden; width:20px; height:20px; line-height:20px; text-align:center; position:relative}
.sns_button_list li a span { display:none}
.sns_button_list li a:before { font-family:'design_plus'; font-size:15px; display:block; position:absolute; top:1px; left:0; right:0}
.sns_button_list li.twitter a:before { font-family: 'tiktok_x_icon'; content: "\e901"}
.sns_button_list li.tiktok a:before { font-family: 'tiktok_x_icon'; content: "\e900"}
.sns_button_list li.facebook a:before { content:'\e902'}
.sns_button_list li.insta a:before { content:'\ea92'}
.sns_button_list li.pinterest a:before { content:'\e905'}
.sns_button_list li.google a:before { content:'\e900'}
.sns_button_list li.youtube a:before { font-family: 'footer_bar'; content: "\ea9d"}
.sns_button_list li.contact a:before { content:'\f003'}
.sns_button_list li.rss a:before { content:'\e90b'}
/* メッセージをフッターリンクに改修 */
.menu-footer-link-container { position: absolute; top: 50%; transform: translateY(-50%); width:100%; margin-top: 10px; z-index:1; text-align:center}
#menu-footer-link { display: flex; justify-content: center; flex-wrap: wrap}
#menu-footer-link li { padding-right: 10px}
#menu-footer-link li:before { content: "|"; padding-right: 10px}
#menu-footer-link li:first-child:before { content: ""}
@media screen and (max-width: 1151px) {
  #menu-footer-link { margin: 20px 0 0; padding: 15px 0}
  #menu-footer-link li { padding: 10px}
  .page_navi .prev:before { margin-right: 30px!important; font-size: 20px}
  .page_navi .next:before { margin-left: 30px!important; font-size: 20px}
}
#menu-footer-link li a.window { display: inline-block; padding-right: 24px; background: url("/solution/wp-content/themes/drop-child/img/common/icon-window.avif") no-repeat right center/16px auto}
.box-link a, a.box-link { display: flex; justify-content: center; align-items: center; width: 70%; height: 50px; margin: 50px auto; border: 1px solid #000}
a.box-link { max-width: 300px; margin: 50px auto 0}
@media screen and (min-width: 1151px) { 
  .box-link a { width: 320px}
}
/* ------------------------------------------------
　responsive.cssから移植
------------------------------------------------ */
/* フッターロゴ */
#footer_logo img { width: 112px!important; height: auto;}
@media only screen and (max-width: 428px) {
  #footer_logo img { margin-bottom: 80px; width: 60%; max-width: 50px; height: auto;}
}
@media only screen and (max-width: 767px) {
  #footer_logo img { margin-bottom: 80px; max-width: 70px;}
}
@media screen and (max-width:1151px) {
  #footer_bottom { height:auto !important; padding:40px 0}
  #footer_logo { margin:0; position:relative; left:auto; top:auto; -ms-transform: translateY(0%); -webkit-transform: translateY(0%); transform: translateY(0%)}
}
@media screen and (max-width:750px) {
	#footer_logo .logo_image.pc { display:none}
  #footer_logo .logo_image.mobile { display:block}
}
/* SNSボタン */
@media screen and (max-width:1151px) {
  #footer_sns { margin:30px 0 0 0; position:relative; right:auto; top:auto}
}
@media screen and (max-width:750px) {
	#footer_sns { margin:25px 0 0 0}
}
/* コピーライト */
@media screen and (max-width:750px) {
  #copyright { line-height:50px; height:50px}
}
/* ページ上部へ戻るボタン */
@media screen and (max-width:750px) {
  #return_top a { height:50px; width:50px; line-height:50px}
}
/* ------------------------------------------------
 responsive.css相殺追記
------------------------------------------------ */
@media screen and (max-width:1151px) {
  #footer_logo img{ margin-bottom: 80px; max-width: 70px!important; height: auto}
}

/* ページ上部へ戻るボタン */
#return_top a { background:#000; display:block; height:60px; width:60px; line-height:60px; text-decoration:none; z-index:100; position:relative}
#return_top a:hover { color:#fff !important}
#return_top span { text-indent:100%; white-space:nowrap; overflow:hidden; display:block}
#return_top a:before { color:#fff; font-family:'design_plus'; content:'\e911'; font-size:12px; display:block; width:12px; height:12px; position:absolute; left:0; right:0; top:4px; margin:auto}
#return_top { position:fixed; right:0px; bottom:0px; z-index:999; transform: translate3d(0,100%,0)}
#return_top.active { transform: translate3d(0,0,0)}
/* コピーライト */
#copyright { line-height:60px!important; height:60px; font-size:12px; text-align:center}
/* ------------------------------------------------
 Common・Layout
------------------------------------------------ */
.contents-inr { width: 100%; min-width: 320px; padding: 0 20px}
.text-center { text-align: center!important}
.text-deco-line { text-decoration: underline}
.sec-base { padding: 30px 20px}
.service-top.sec-base { padding: 30px 0}
.text-left {text-align: left!important}
@media screen and (max-width: 767px) {
  .contents-inr { padding: 0 20px!important}
  .sm-hidden { display: none!important}
  .sp-only { display: block}
  .pc-only { display: none}
}
@media screen and (min-width: 768px) { 
  .pc-hidden { display: none !important}
  .contents-inr { max-width: 1030px; margin: 0 auto}
  .sp-only { display: none}
  .pc-only { display: block}
}
/* パンくずリンクC */
#bread_crumb03 { position: static!important; width:100%; border-top: 1.5px solid #ddd; border-bottom: 1.5px solid #ddd}
#bread_crumb03 ul { margin: 13px auto!important; overflow:hidden; white-space: nowrap; text-overflow: ellipsis; visibility:visible}
#bread_crumb03 li { display:inline; font-size:12px; margin:0 10px 0 0; padding:0 20px 0 0; position:relative}
#bread_crumb03 li:after { font-family:'design_plus'; content:'\e910'; font-size:10px; color: #333; display:inline-block; line-height:60px; height:59px; position:absolute; right:0px; bottom:-23px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale}
#bread_crumb03 li:last-of-type:after { display:none}
#bread_crumb03, #bread_crumb03 li.last { color: #333}
#bread_crumb03 li a { color: #333; height: 29px; line-height: 30px; display:inline-block; -webkit-transition: opacity 0.2s ease-in-out; transition: opacity 0.2s ease-in-out}
#bread_crumb03 li a:hover { opacity:0.5}
#bread_crumb03 li.category a { display:none}
#bread_crumb03 li.category a:first-of-type { display:inline-block}
#bread_crumb03 li.home a { position:relative; width:16px}
#bread_crumb03 li.home a span { opacity:0}
#bread_crumb03 li.home a:before { font-family:'design_plus'; content:'\e90c'; font-size:12px; color: rgba(0,0,0,1); display:inline-block; height:100%; line-height:1; top:0px; position:relative; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale}
@media screen and (max-width: 767px) {
  #bread_crumb03 ul { padding: 0 20px}
}
@media screen and (min-width: 768px) { 
  #bread_crumb ul { width: 1030px}
  #bread_crumb03 ul { max-width: 1030px}
}
.btn-sns { display: flex; justify-content: flex-start; margin-bottom: 30px;}
.btn-sns a { display: flex; align-items: center; height: 30px; margin-right: 5px; padding: 0px 5px; color: #fff!important; font-size: 10px; text-align: center; border-radius: 3px;}
.btn-sns a:hover { opacity: 0.8;}
.btn-sns .twitter a { background: #333;}
.btn-sns .facebook a { background: #1877f2;}
.btn-sns .line a { background: #00b900;}
.btn-sns a i { line-height: 30px; margin-right: 5px;  color: #fff}
.btn-sns .icon-twitter::after { content:'\e901'; font-family: "tiktok_x_icon";}
.btn-sns .icon-facebook::after { content:'\e902'; font-family: "design_plus"; font-size: 12px}
.btn-sns .icon-line::after { content:'\e909'; display: inline-block; margin-top: 5px; font-family: "design_plus"; font-size: 18px}
#main-single .ul-tag { font-size: 16px;}
#main-single .post_content { margin-bottom: 50px}
#main-single .post_content figure { width:100%; text-align: center}
#main-single .post_content .box-company { clear: both; width: 100%; margin: 50px 0; padding: 20px; background: #f6f6f6; border-radius: 6px}
@media screen and (max-width: 767px) {
  #main-single, #main-archive { padding: 0 20px}
}
@media screen and (min-width: 768px) {   
  #main-single, #main-archive { max-width: 1030px; margin: 50px auto 0;}
  .btn-sns a, #main-archive .btn-sns a, #main-top .btn-sns a, #post_content .btn-sns a { margin-right: 8px; padding: 0px 14px; font-size: 11px}
  #main-single .post_content img { width: 100%;}
}
/* SLICK Slider */
.slick-slider { position: relative; display: block; box-sizing: border-box; user-select: none; touch-action: pan-y; -webkit-tap-highlight-color: transparent;}
.slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0;}
.slick-list:focus { outline: none;}
.slick-list.dragging { cursor: pointer; cursor: hand;}
.slick-slider .slick-track, .slick-slider .slick-list { transform: translate3d(0, 0, 0);}
.slick-track { position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto;}
.slick-track:before, .slick-track:after { display: table; content: '';}
.slick-track:after { clear: both;}
.slick-loading .slick-track { visibility: hidden;}
.slick-slide { display: none; float: left; height: 100%; min-height: 1px;}
[dir='rtl'] .slick-slide { float: right;}
.slick-initialized .slick-slide { display: block;}
.slick-loading .slick-slide { visibility: hidden;}
.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent;}
.slick-arrow.slick-hidden  { display: none;}
/* SLICK Arrows */
.slick-prev, .slick-next { font-size: 0; line-height: 0; position: absolute; top: 50%; display: block; width: 20px; height: 20px; padding: 0; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); cursor: pointer; color: transparent; border: none; outline: none; background: transparent;}
.slick-prev:before, .slick-next:before { color: #fff; font-size: 20px; line-height: 1;}
.slick-prev { top: 40%; left: -30px; width: 40px; height: 40px; background: rgba(0,0,0,0.8); border-radius: 50px; z-index:10;}
[dir='rtl'] .slick-prev { top: 40%; right: -30px; left: auto;}
.slick-prev:before { content: '←';}
[dir='rtl'] .slick-prev:before { content: '→';}
.slick-next { top: 40%; right: -30px; width: 40px; height: 40px; background: rgba(0,0,0,0.8); border-radius: 50px; z-index:10;}
[dir='rtl'] .slick-next { top: 40%; right: -30px;}
.slick-next:before { content: '→';}
[dir='rtl'] .slick-next:before { content: '←';}
@media print, (min-width: 768px) { 
  .slick-prev, .slick-next { width: 50px; height: 50px;}
  .slick-prev, [dir='rtl'] .slick-prev { left: -20px;}
  .slick-next, [dir='rtl'] .slick-next { right: -20px;}
}