@charset "UTF-8";
@import 'sanitize.css';
body { margin: 0; padding: 0; color: #000; background: #fff; font-family:"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Noto Sans Japanese", "游ゴシック体", "Yu Gothic Medium", YuGothic, sans-serif; font-size:16px; }
h1,h2,h3,h4,h5,h6{ margin: 0; padding: 0; font-weight: normal; letter-spacing: normal; }
ul,li,ol{ margin: 0; padding: 0; list-style: none;}
a{ text-decoration: none; cursor: pointer; }
.clr:after{ content:""; display:block; height:0; clear:both; visibility:hidden; }

/* ################################## headroom ################################## */
.headroom{ z-index: 9999999; position: fixed; height: 140px; top: 0; left: 0; right: 0; box-shadow: 0px 0px 5px rgba(255,255,255,0); background-color: #fff; }
.headroom--pinned { top: 0px; box-shadow: 0px 0px 5px rgba(0,0,0,0.2); background-color: #000; -webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out;}
.headroom--unpinned { top: -170px; box-shadow: 0px 0px 5px rgba(0,0,0,0); background-color: transparent;  -webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out;}
.headroom--pinned #switchBtnArea #switchBtn{ position: fixed; -webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out;}
.headroom--unpinned #switchBtnArea #switchBtn{ position: absolute; -webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out; }
.headroom--top { background-color: #fff;  }
.headroom--not-top {  background-color: #fff; }
.headroom--top .TopMenuBox{ margin: 0px; top:0; width: 100%;}
.headroom--pinned .TopMenuBox{ margin-top: 0px; }
.headroom--not-top .TopMenuBox{ margin-top: 0px!important; transition: all .5s; }
/* ################################## End headroom ################################## */

/* ################################## Header ################################## */
/* header */
header{ position: fixed; top:0; height: 120px; z-index: 9999999; margin: 0px; padding: 0px; width: 100%; background-color: #fff; /*border-bottom: 1px solid #eee;*/ }
/* header.White */
header.White{ background-color: #fff;}
header.White .TopMenuBox{ background-color: #fff;}
header.White .TopMenu{ max-width: 990px;}
header.White .LogoTop{ max-width: 60px; }
header.White .MenuTopLoginRegister{ width: calc(100% - 150px); }
/*header.White .MenuTop{ width: calc(100% - 150px); }*/
header.White #rwdMenuWrap ul li a{ color: #000; margin: 0px 0px 0px 5px;}
header.White #rwdMenuWrap ul li a:hover{ color: #666;}
#rwdMenuWrap ul li a span{font-family:"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Noto Sans Japanese", "游ゴシック体", "Yu Gothic Medium", YuGothic, sans-serif;}
header.White .MenuTop #rwdMenuWrap ul li:nth-child(4):after{ background-color: #000; }
/* TopMenu */
.TopMenuBox{ width: 100%; height: auto;/* overflow: hidden;*/ margin: auto; position: relative; background-color: #fff; }
.TopMenu{ max-width: 1180px; height: auto;  display: block; margin: auto; padding: 0; position: relative; }
.LogoTop{ float: left; width: calc(100% - 750px); max-width: 230px; padding-top: 30px; }
.LogoTop a{ display: block; }
.LogoTop img{ width:100%; height: auto; max-width: 230px; }
.LogoMobile{ display: none;}
.LogoMobileFixed{ display: none;}
.MenuTopLoginRegister{ /*width: calc(100% - 150px);*/ height: auto; float: right; position: relative; z-index: 9999999; text-align: right; padding-top: 30px; font-size: 14px; font-weight: 600; }
.MenuTopLoginRegister .RegisterLink{ padding: 6px 40px; background-color: #fff; border: 1px solid #000; color: #000; margin-right: 10px;}
.MenuTopLoginRegister .LoginLink{ padding: 6px 40px; background-color: #000; border: 1px solid #000; color: #fff;}
.MenuTopLoginRegister a.RegisterLink:hover{ background-color: #000; border: 1px solid #000; color: #fff;}
.MenuTopLoginRegister a.LoginLink:hover{ background-color: #a80000; border: 1px solid #a80000; color: #fff;}
.SearchAndMenu{ width: 100%; height: auto; margin: auto; display: flex; flex-wrap: wrap; justify-content: space-between; }
.MenuTop{ /*width: calc(100% - 150px); width: 84%; */ width: 100%; height: auto; float: left; position: relative; z-index: 9999999; text-align: left; margin-top: 30px; order: 1; }
.MenuTop #rwdMenuWrap ul{ width: auto; margin: 0px; padding: 0px; background-color: transparent; display: flex; justify-content: center; align-items: center; }
.MenuTop #rwdMenuWrap ul li{ width: auto; margin: 0px; padding: 0px; margin-top: 10px; position: relative; }
.SearchTop{ width: 16%; order: 2; position: relative; /*margin-top: 45px;*/ }
.SearchTop input[type=text]{ display: inline-block; outline:none; width: 100%; max-width: 200px; padding: 5px 45px 5px 5px; -webkit-appearance: none; -moz-appearance: none; appearance: none; border:0px; border-bottom: 1px solid #000; }
.SearchTop button { position: absolute; right: 0px; top: 2px; display: inline-block; background-color: #000; color: #fff; outline:none; border: 0; cursor: pointer;-webkit-appearance: none; -moz-appearance: none; appearance: none; transition: all .3s; padding: 3px 7px; }
.SearchTop img{ width: 100%; height: auto; max-width: 14px;}
.SearchTopMobile{ display: none; color: #fff;  margin-top: 20px; position: relative; text-align: center; }
.SearchTopMobile input[type=text]{ display: inline-block; outline:none; max-width:200px; padding: 5px 10px 5px 0px; margin: auto; -webkit-appearance: none; -moz-appearance: none; appearance: none; border:0px; border-bottom: 1px solid #000; }
.SearchTopMobile button { position: absolute; margin-left: -150px; top: 5px; display: inline-block; background-color: transparent; outline:none; border: 0; cursor: pointer;-webkit-appearance: none; -moz-appearance: none; appearance: none; transition: all .3s; }
.SearchTopMobile2{ color: #fff;  margin-top: 20px; position: relative; text-align: center; }
.SearchTopMobile2 input[type=text]{ display: inline-block; outline:none; max-width:200px; padding: 5px 10px 5px 0px; margin: auto; -webkit-appearance: none; -moz-appearance: none; appearance: none; border:0px; border-bottom: 1px solid #000; }
.SearchTopMobile2 button { position: absolute; margin-left: -150px; top: 5px; display: inline-block; background-color: transparent; outline:none; border: 0; cursor: pointer;-webkit-appearance: none; -moz-appearance: none; appearance: none; transition: all .3s; }
/*.MenuTop #rwdMenuWrap ul li:nth-child(4):after{ position: absolute; content: ''; width: 1px; height: 25px; background-color: #eee; right: -10px; top: 5px;}*/
/* RightSignupBox */
.RightSignupBox{ display: none; position: fixed; right: 10px; margin-top: -52px; width: auto; height: 50px; line-height: 50px; text-align: center; color: #fff; }
/* HanBarber Menu */
#switchBtnArea { float: right; position: relative;  z-index: 9999999999; width: 26px; padding-top: 33px; margin-left: 20px; }
#switchBtnArea #switchBtn { position: relative; z-index: 9999999999; display: block; width: 20px; height: 20px; }
#switchBtnArea #switchBtn.btnClose  [class*="humberger-border"] { background: #111; z-index: 9999999999; }
#switchBtnArea #switchBtn div { display: inline-block; box-sizing: border-box;  transition: all .4s; }
#switchBtnArea #switchBtn [class*="humberger-border"] { position: absolute; left: 0;  display: block; width: 20px; height: 2px; background: #000; }
#switchBtnArea #switchBtn div:nth-of-type(1){ margin-top: 7px; }
#switchBtnArea #switchBtn div:nth-of-type(3){ bottom: 4px; }
#switchBtnArea #switchBtn.btnClose div:nth-of-type(1){ top: 8px;  -webkit-transform: translateX(2px) translateY(-7px) rotate(225deg); transform: translateX(2px) translateY(-7px) rotate(225deg); }
#switchBtnArea #switchBtn.btnClose div:nth-of-type(2){ top: 28px; display: none;  background: transparent; opacity: 0; }
#switchBtnArea #switchBtn.btnClose div:nth-of-type(3){ top: 1px;  -webkit-transform: translateX(2px) translateY(7px) rotate(135deg); transform: translateX(2px) translateY(7px) rotate(135deg); }
#rwdMenuWrap { position: relative; display: inline; top:auto; right:0; z-index: 9999999; width: 100%; height: 100%; margin: 0 auto; background: #262b42; }
#rwdMenuWrap ul { margin-top: 45px; width: 100%; box-sizing: border-box;  padding: 3px 12px 0; }
#rwdMenuWrap ul li { display: inline-block; position: relative; width: auto; border-bottom: 0px solid #575b6e; text-align: center; }
#rwdMenuWrap ul li span{ font-size: 14px; font-weight: 500; display: inline-block; padding-left: 5px;}
#rwdMenuWrap ul li:hover a{ color: #112233;}
#rwdMenuWrap ul li a{ width: 100%; display: inline-block; padding: 7px 10px 7px 10px; color: #000; text-align: center; margin: 0px 5px 0px 5px; font-size: 20px; font-weight: 600; letter-spacing: 0x; border: 0px; transition: all 0s; font-family: helvetica,arial, sans-serif;}
#rwdMenuWrap ul li:last-child a{ padding-right: 0; margin-right: 0;}
#rwdMenuWrap ul li img{ width: 22px; vertical-align:middle; margin-right: 0px; margin-left: -10px; margin-top: -5px; filter: brightness(0) invert(0); }
#rwdMenuWrap ul li a:hover { color: #666; }
.AllNavigation{ position: fixed; top:0; right:-100%; z-index: 99999999; width: 100%; height: 100%; margin: 0 auto; padding: 0px 0 40px 0; background: #eee; color: #fff; }
.AllNavigationBox{ width: auto; height: 100%; margin: auto; }
.AllNavigationBox .TLogo{ margin: 0; text-align: center; padding: 30px 0; background-color: #fff; }
.AllNavigationBox .TLogo img{ max-width: 200px; max-height: 50px; height: auto; }
.AllNavigationBox .Inner{ width: auto; max-width: 1020px; height: 100%; margin: auto; padding: 40px 0 0 0; /*overflow: scroll;*/ background-color: #eee; }
.AllNavigationBox .InnerSpace{ width: auto; height: 90%;overflow: scroll; background-color: #eee;}
.LinkMemberShip{ padding: 6px 0px; margin-right: 10px; color: 	#515254; font-size: 15px; }
.Section1{ position: relative; order: 1; }
.Section2{ position: relative; order: 2; }
.Section3{ position: relative; order: 3; }
.Section4{ position: relative; order: 4; }
.OneColumn{ display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap;  }
.TwoColumn{ display: flex; justify-content: space-between; align-items: start; flex-wrap: wrap; }
.ThreeColumn{ display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap;  }
.ItemList{ width: 48%; display: block; overflow: hidden; }
.ItemList a{ color: #111;}
.ItemList p:nth-child(1){ width: calc(100% - 190px); float: left; max-width: 190px; padding: 5px 10px; background-color: #fff; color: #000; font-weight: 600; text-align: center; }
.ItemList p:nth-child(2){ width: calc(100% - 190px); float: left; padding-left: 50px; padding: 5px 10px 5px 40px; }
.ItemList p:nth-child(2) img{ width: auto; height: auto; max-width: 24px; max-height: 24px; margin-right:5px;}
.HoverLink:hover p:nth-child(1){ background-color: #000; color: #fff;}
.HoverLink:hover p:nth-child(2){ background-color: #fff;}
.ItemList p.FooterSocial{display: flex; justify-content:space-between; flex-wrap: wrap; max-width: 240px;}
.ItemList p.FooterSocial a{ color: #111;display: block; width: 22%;}
.SearchFormBox{ position: relative; width: 100%; max-width: 400px; margin: auto; margin-top: 40px; margin-bottom: 40px; text-align: center;}
.SearchFormBox input[type=text]{ display: inline-block; outline:none; width: 100%; text-align: center; padding: 10px 10px 10px 10px; -webkit-appearance: none; -moz-appearance: none; appearance: none; border:0px; background-color: transparent; border-bottom: 1px solid #000; }
.SearchFormBox button { position: absolute; right: -35px; top: 5px; display: inline-block; background-color: transparent; outline:none; border: 0; cursor: pointer;-webkit-appearance: none; -moz-appearance: none; appearance: none; transition: all .3s; }
.SearchFormBox button img{ width: 100%; height: auto; max-width: 24px;}
.ThreeBox{ margin: 40px 0; width: 30%; text-align: center; font-size: 20px; font-weight: 600; }
.ThreeBox span{ font-size: 15px; font-weight: 300; }
.ThreeBox a{ color: #000; display: block;}
.ThreeBox a:hover{ color: #fff; background: #000;}
.Category2List{ margin: 0; width: 47%;}
.Category2List .CategoryTitle{ font-size: 18px; font-weight: 600; color: #000; border-bottom: 1px solid #000; padding-bottom: 10px; margin-bottom: 20px;}
.Category2List .CategoryTitle span{ font-size: 14px; font-weight: 300;}
.Category2List ul li{ margin: 0; padding: 2px 0;}
.Category2List ul li a{ color: #000; font-size: 15px; display:  block; padding: 3px 5px;} 
.Category2List ul li a:hover{ color: #fff; background: #000;}

#rwdMenuWrap ul li:hover .SubMenu { display: flex !important; }
#rwdMenuWrap ul li .SubMenu { display: none;flex-wrap: nowrap; gap: 30px;justify-content: center; text-align: left; position: absolute;width:auto; min-width: 650px; left: 0; top: 40px; height: auto; padding: 15px 20px 15px 20px; background: #fff; box-shadow: 4px 5px 6px rgba(0, 0, 0, 0.2); background: #253861;}
#rwdMenuWrap ul li .SubMenu ul { display: block; height: auto; padding: 0; min-width: 210px; width: auto;color: #fff; margin: 0; flex-basis: 40%; }
#rwdMenuWrap ul li .SubMenu ul:nth-child(2) { flex-basis: 60%; }

#rwdMenuWrap ul li .SubMenu ul li { display: block; width: auto; margin: 0; padding: 0;  }
#rwdMenuWrap ul li .SubMenu ul li a {margin: 0; color: #fff; display: block; padding: 3px 6px; font-size: 14px; letter-spacing: 0; font-weight: 400; text-align: left; line-height: 1.5em;}
#rwdMenuWrap ul li .SubMenu ul li a:hover { color: #000; background: #fff;}
#rwdMenuWrap ul li .SubMenu ul .TitleCat{ border-bottom: 1px solid #fff; padding-bottom: 5px; font-size: 16px; display: block; margin-bottom: 12px; font-weight: 700!important; }
/*#rwdMenuWrap ul li .SubMenu ul li a:before {  content: '・'; }*/
/* ################################## End Header ################################## */


/* ################################## Footer ################################## */
/* Footer */
footer{ background-color: #F0F0F0; color: #000; padding: 0; overflow: auto; margin-top: 40px; border-bottom: 50px solid #253861; }
footer .FooterBox{ height: auto; margin: auto; overflow: auto; padding: 60px 0; position: relative; max-width: 1180px;}
footer .FooterThreeColumn{ display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; font-size: 13px; line-height: 23px; }
footer .FooterThreeColumnItemList{ width: 42%; display: block; overflow: hidden; }
footer .FooterBox .FooterThreeColumnItemList .Title{ font-size: 18px; font-weight: bold; margin-bottom: 15px;}
footer .FooterBox .FooterForm{ margin: 15px 0; position: relative; width: 100%; max-width: 80%; }
footer .FooterBox .FooterForm input[type=email],footer .FooterBox .FooterForm input[type=text]{ display: inline-block; outline:none; width: 100%; text-align: left; /*padding: 10px 10px 10px 10px;*/ padding: 10px 10px 10px 65px; -webkit-appearance: none; -moz-appearance: none; appearance: none; border:0px; background-color: transparent; border-bottom: 1px solid #000; }

footer .FooterBox .FooterForm button.submit-btn{ position: absolute; right: -65px; top: 5px; padding: 7px 15px; display: inline-block; background-color: #000; color: #fff; outline:none; border: 0; cursor: pointer;-webkit-appearance: none; -moz-appearance: none; appearance: none; transition: all .3s; }
.FooterBox .FooterForm #newsletter input[type="submit"]{ position: absolute; right: -65px; top: 5px; padding: 7px 15px; display: inline-block; background-color: #000; color: #fff; outline:none; border: 0; cursor: pointer;-webkit-appearance: none; -moz-appearance: none; appearance: none; transition: all .3s; }
footer .FooterBox .FooterThreeColumnItemList .ItemList{ width: 100%; display: block; overflow: hidden; margin-bottom: 20px; }
footer .FooterBox .FooterThreeColumnItemList .ItemList a{ color: #111;}
footer .FooterBox .FooterThreeColumnItemList .ItemList p:nth-child(1){ width: calc(100% - 190px); float: left; max-width: 190px; padding: 5px 10px; background-color: transparent; color: #000; font-weight: 600; text-align: left; font-size: 15px;}
footer .FooterBox .FooterThreeColumnItemList .ItemList p:nth-child(2){ width: calc(100% - 190px); float: left; padding-left: 50px; padding: 5px 10px 5px 40px; font-size: 15px;}
footer .FooterBox .FooterThreeColumnItemList .ItemList p:nth-child(2) img{ width: auto; height: auto; max-width: 35px; max-height: 35px; margin-right:10px;}
footer .FooterBox .FooterThreeColumnItemList .HoverLink:hover p:nth-child(1){ background-color: #000;color: #fff;}
footer .FooterBox .FooterThreeColumnItemList .HoverLink:hover p:nth-child(2){ background-color: #fff;}

footer .FooterBox .Left{ padding-right: 20px; font-size: 15px;}
footer .FooterBox .Right{ padding-left: 20px; text-align: right;}
footer .FooterBox .FooterSocial{ display: block; margin-bottom: 0px;}
footer .FooterBox .FooterSocial a.FacebookIcon{ display: inline-block; margin-bottom: 0px; width: 40px; /*height: 40px; background-color: #000; color: #fff; text-align: center; line-height: 38px; border-radius: 100px;*/}
/*footer .FooterBox .FooterSocial a.FacebookIcon:hover{ background-color: #666;}*/
footer .FooterBox .FooterSocial .FacebookIcon img{ width: 100%; height: auto; max-height: 30px; max-width: 30px; /*filter: brightness(0) invert(1);*/}
footer .FooterBox .FooterSocial a.TwitterIcon{ display: inline-block; margin-bottom: 0px; width: 40px; /*height: 40px; background-color: #000; color: #fff; text-align: center; line-height: 38px; margin-left: 10px; border-radius: 100px;*/ }
footer .FooterBox .FooterSocial .TwitterIcon img{ width: 100%; height: auto; max-height: 30px; max-width:30px; /*filter: brightness(0) invert(1);*/}
/*footer .FooterBox .FooterSocial a.TwitterIcon:hover{ background-color: #666;}*/
footer .FooterBox .FooterSocial a.LineIcon{ display: inline-block; margin-bottom: 0px; width: 40px; /*height: 40px; background-color: #000; color: #fff; text-align: center; line-height: 38px; margin-left: 10px; border-radius: 100px;*/}
footer .FooterBox .FooterSocial .LineIcon img{ width: 100%; height: auto; max-height: 30px; max-width:30px; /*filter: brightness(0) invert(1);*/}
/*footer .FooterBox .FooterSocial a.LineIcon:hover{ background-color: #666;}*/
footer .FooterBox .FooterSocial a.YoutubeIcon{ display: inline-block; margin-bottom: 0px; width: 40px; /*height: 40px; background-color: #000; color: #fff; text-align: center; line-height: 38px; margin-left: 10px; border-radius: 100px;*/}
/*footer .FooterBox .FooterSocial a.YoutubeIcon:hover{ background-color: #666;}*/
footer .FooterBox .FooterSocial .YoutubeIcon img{ width: 100%; height: auto; max-height: 30px; max-width: 30px; /*filter: brightness(0) invert(1);*/}
footer .FooterBox .FooterLogo{ margin-bottom: 45px; overflow: auto; font-size: 13px; display: flex; align-items: end;}
footer .FooterBox .FooterLogo .Logo{ width: 60px; max-width: 60px; margin-right: 10px; height: auto; }
footer .FooterBox .FooterLogo .Logo img{ width: auto; max-width: 60px; height: auto;}
footer .FooterBox .FooterLogo .Text{ display: inline-block; font-weight: 600;}
footer .FooterBox .FooterLogo .Text br{ display: inline-block;}
footer .FooterBox .Lang{ position: absolute; top: 60px; right: 0;}
footer .FooterBox a{ color: #000;}
footer .FooterBox a:hover{ color: #666;}
footer .FooterBox p{ margin: 0; padding: 0;}
footer .FooterBox p.desc{ margin: 0; padding: 0; font-size: 15px; }
footer .FooterBox .FooterNav{ font-size: 13px; }
footer .FooterBox .FooterNav ul { margin: 0; padding: 0;}
footer .FooterBox .FooterNav ul li{ margin: 25px 0 25px 0; display: block; }
footer .FooterBox .FooterNav ul li span{ font-size: 19px; font-weight: 600; display: inline-block; margin-right: 5px; font-family: helvetica, arial, sans-serif;}
footer .FooterBox .FooterNav ul li a{ text-decoration: none;}
footer .LogoLinks{ margin: 50px 0 20px; font-size: 15px; display: flex; flex-wrap: wrap; justify-content: left; align-items: center; width: 100%;}
footer .LogoLinks .LogoF{ width: 25%; }
footer .LogoLinks .LogoF img{width: 100%; max-width: 180px; height: auto;}
footer .Copyrights{ padding: 10px 0; text-align: left; font-size: 12px; letter-spacing: 1px; font-family: helvetica, arial, sans-serif;}
footer .NavigationFooter{ margin: 20px 0 50px 0;}
footer .NavigationFooter ul{ display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: center; margin-top: 30px; }
footer .NavigationFooter ul li{ font-size: 15px; padding: 10px 20px; }
footer .NavigationFooter ul li:first-child{ padding-left: 0;}
footer .NavigationFooter ul li:last-child{ padding-right: 0;}
/* BacktoTop */
.cd-top { display: block; height: 40px; width: 40px; position: fixed; bottom: 20px; right: 20px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.05); border-radius: 50%; overflow: hidden; text-indent: 100%; white-space: nowrap; background: #000 url(../images/icon/icon-btt.svg) no-repeat center; background-size: 50%; visibility: hidden; opacity: 0; z-index: 100; -webkit-transition: opacity .3s 0s, visibility 0s .3s; -moz-transition: opacity .3s 0s, visibility 0s .3s; transition: opacity .3s 0s, visibility 0s .3s; }
.cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover { -webkit-transition: opacity .3s 0s, visibility 0s 0s; -moz-transition: opacity .3s 0s, visibility 0s 0s; transition: opacity .3s 0s, visibility 0s 0s; }
.cd-top.cd-is-visible { visibility: visible; opacity: 1; }
.cd-top.cd-fade-out { opacity: .8; }
.no-touch .cd-top:hover { background: rgba(250,176,6,1); opacity: 1; }
/* ################################## End Footer ################################## */

/* SectionShare */
.SectionShare{ position: fixed; left: 10px; top: 35%; width: 60px; height: auto; z-index: 9; padding: 10px 0; background-color: #fff; border-radius: 10px; box-shadow: 1px 1px 10px rgba(0,0,0,0.1)}
.SectionShare .Title{ margin: 0 0 10px 0; font-size: 13px; font-weight: 400; text-align: center; }
.SectionShare ul{ margin: 0px 0 0 0; padding: 0;}
.SectionShare ul li{ margin-bottom: 10px; text-align: center; }
.SectionShare ul li:last-child{margin-bottom: 0;}
.SectionShare ul li a{ width: 40px; height: 40px; margin: auto; border-radius: 100px; display: flex; justify-content: center; align-items: center; }
.SectionShare ul li .XClass{ background-color: #000;}
.SectionShare ul li .XClass img{ max-width: 25px; max-height: 25px; filter: brightness(0) invert(1); }
.SectionShare ul li .FacebookClass{ background-color: #425996;}
.SectionShare ul li .FacebookClass img{ max-width: 25px; max-height: 25px; filter: brightness(0) invert(1); }
.SectionShare ul li .LineClass{ background-color: #06c755;}
.SectionShare ul li .LineClass img{ max-width: 25px; max-height: 25px; filter: brightness(0) invert(1); }
.SectionShare ul li .PinterestClass{ background-color: #E60023;}
.SectionShare ul li .PinterestClass img{ max-width: 25px; max-height: 25px; filter: brightness(0) invert(1); }
.SectionShare ul li .LinkClass{ background-color: #ccc;}
.SectionShare ul li .LinkClass img{ max-width: 25px; max-height: 25px; filter: brightness(0) invert(1); }
.SectionShare ul li .TextClass{ background-color: #000;}
.SectionShare ul li .TextClass img{ max-width: 20px; max-height: 20px; filter: brightness(0) invert(1); }
.SectionShare .MRT20{ margin-top: 20px;}
.CopyLink{ position: relative;}
.successMessage{ display: none; position: absolute; width: 70px; bottom: 110px; right: -70px; color: #999;}
/* End SectionShare */ 

/* Added 2025.09.05 */
.hs_email{ position: relative;}
.hs_email label{ position: absolute; top: 8px; font-size: 13px; }
.hs_email label.hs-error-msg{ position: relative; color: rgb(220, 50, 50); font-size: 13px; }
label.hs-main-font-element{ position: relative; color: rgb(220, 50, 50)!important; font-size: 13px; }
ul.hs-error-msgs{ color: rgb(220, 50, 50)!important; font-size: 13px; }
.DisplayMagazin .NewsletterTop2Column .hbspt-form{ width: 50%; position: relative; }
.DisplayMagazin .NewsletterTop .hbspt-form{ position: relative; }
.DisplayMagazin .NewsletterTop input[type=email], .DisplayMagazin .NewsletterTop input[type=text]{ padding: 10px 10px 10px 65px; }

.Section3Box{ margin: 20px 0 60px 0;}
.Section3Box .Inners{ display: flex; justify-content: space-between; flex-wrap: nowrap; gap: 4%; }
.Section3Box .Inners .Links{ width: 33%; }
.Section3Box .Inners .Links a{ display: block; padding: 5px 10px; background-color: #fff; color: #000; font-weight: 600; text-align: center;}
.Section3Box .Inners .Links a:hover{ background-color: #000; color: #fff;}
.SectionEnewSNS{ margin: 60px 0 60px 0; position: relative;}
.SectionEnewSNS .Inners{ position: relative;}
.SectionEnewSNS .Inners{ display: flex; justify-content: space-between; flex-wrap: nowrap; align-items: flex-start; gap: 4%; position: relative; }
.SectionEnewSNS .Inners .LeftEnews{ width: 65%; color: #111; position: relative; font-weight: 600; display: flex; justify-content: space-between; flex-wrap: nowrap; align-items: center;}
.SectionEnewSNS .Inners .LeftEnews .EnewsText{ width: 250px; margin: 0; font-size: 15px; font-weight: 600; text-align: left; vertical-align: middle;}
.SectionEnewSNS .Inners .LeftEnews .EnewsBox{ width: 100%; padding-left: 20px; position: relative; }
.SectionEnewSNS .Inners .LeftEnews input[type=email],.SectionEnewSNS .Inners .LeftEnews input[type=text]{ display: inline-block; outline:none; width: 100%; text-align: left; padding: 10px 10px 10px 60px; -webkit-appearance: none; -moz-appearance: none; appearance: none; border:0px; background-color: transparent; border-bottom: 1px solid #000; }
.SectionEnewSNS .Inners .LeftEnews input[type="submit"]{ position: absolute; right: 0px; top: 2px; padding: 7px 15px; display: inline-block; background-color: #000; color: #fff; outline:none; border: 0; cursor: pointer;-webkit-appearance: none; -moz-appearance: none; appearance: none; transition: all .3s; }
.SectionEnewSNS .wpcf7 form .wpcf7-response-output{ margin-top: 0!important;}
.SectionEnewSNS .Inners .RightSNS{ width: 30%; }
.SectionEnewSNS .Inners .RightSNS p.HeaderSocial{ margin: 0; display: flex; justify-content: right; flex-wrap: wrap; }
.SectionEnewSNS .Inners .RightSNS p.HeaderSocial a{ color: #111; display: block; margin: 0 0 0 40px; }

.FirstSP{ margin: 0 0 40px 0; display: flex; justify-content: center; flex-wrap: nowrap; gap:10%;}
.FirstSP .SearchTop{ width: 100%;}
.FirstSP .SearchTopMobileSB{ padding-right: 10px;
	outline: none;
	width: 50%;
	text-align: left;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: 0px;
	padding: 0px;
	background-color: transparent;
	border-bottom: 1px solid #000;
	position: relative;
}

.FirstSP .SearchTopMobileSB form{
	padding: 7px 0 0 0;
}
.FirstSP .SearchTopMobileSB .SearchTop input[type=text]{
	border-bottom:none;
	width: 100%;
	max-width: 100%;
	background: none;
}
.FirstSP .SearchTopMobileSB .SearchTop button{
	padding: 7px 15px;	
	position: absolute;
	right: 0px;
	top: 0px;
}

.FirstSP .RightSNS{ padding-left: 10px; width:20%;}
.FirstSP .RightSNS p{ margin: 0; display: flex; justify-content: space-around; }
.FirstSP p.HeaderSocial img{ max-width: 28px; }

.SectionEnewSNS .Inners .LeftEnews{ margin: auto;}

@media(max-width:1280px)
{
	/* ################################## Header ################################## */
	.TopMenu{ max-width: 100%; margin-left: 40px; margin-right: 40px; }
	header.White .TopMenu{ max-width: 990px; margin: auto; }
	.LogoTop{ max-width: 200px; }
	/*.LogoTop a{ margin-top: 10px;}*/
	.MenuTopLoginRegister{ width: calc(100% - 250px); }
	.MenuTop{ margin-top: 25px;}
	/*.SearchTop{ margin-top: 35px; }
	.MenuTop{ width: calc(100% - 150px);}
	.MenuTop #rwdMenuWrap ul li{ margin-top: 10px; }
	.MenuTop #rwdMenuWrap ul li:nth-child(4):after{ height: 25px; }*/
	#rwdMenuWrap ul li a { padding: 7px 5px 5px 7px; /*margin: 0px 0px 0px 0px; font-size: 16px;*/ font-size: 20px; }
	/* ################################## End Header ################################## */
}


/* -------------------------------------  1259px  ------------------------------------- */
@media(max-width:1259px)
{
	/* ################################## Header ################################## */
	/*.MenuTop{ width: 80%;}*/
	.SearchTop{ width: 17%; /*padding-left: 20px;*/ }
	.SearchTop input[type=text]{ max-width: 200px; }
	/* ################################## End Header ################################## */

	/* ################################## Footer ################################## */
	/* footer */
	footer .FooterBox{ max-width: 990px; }
	/* ################################## End Footer ################################## */
}


/* -------------------------------------  1023px  ------------------------------------- */
@media(max-width:1023px)
{
	/* ################################## Headroom ################################## */
	.header{ width: 100%; height: 50px; margin-top: 0px; }
	.headroom{ /*padding-top: 0px; top: 0; left: 0; right: 0;*/ width: 100%; height: 50px;/* box-shadow: 0px 0px 5px rgba(0,0,0,0.2); background-color: #fff;*/ }
	.headroom--pinned { position: fixed; top: 0px;}
	.headroom--unpinned { top: -90px;}
	/*.headroom--unpinned #switchBtnArea #switchBtn{ top: -70px; }*/
	/*.headroom--not-top #switchBtnArea #switchBtn{ position: fixed!important; }*/
	#switchBtnArea { width: 21px!important; padding-top: 17px; margin-left: 5px!important; right: 6px;}
	/* ################################## End Headroom ################################## */
.SearchTop.Front{display: none;}
	/* ################################## Header ################################## */
	/* header */
	header{ overflow: hidden; height: 50px; background-color: #fff; /*border-bottom: 1px solid #eee;*/ }
	/* header.White */
	/*header.White{ background-color: #000;}
	header.White .TopMenuBox{ background-color: #000;}
	header.White .TopMenu{ width: 100%; max-width: 100%; }
	header.White .LogoTop{ max-width: 100%; }
	header.White .MenuTop{ width: auto; }
	header.White #rwdMenuWrap ul li a{ color: #fff;}
	header.White #rwdMenuWrap ul li a:hover{ color: #a80000;}
	header.White .MenuTop #rwdMenuWrap ul li:nth-child(4):after{ display: none; }*/
	/* TopMenu */
	.TopMenuBox{ height: auto; margin: auto; display: block; position: relative;}
	.MenuTopLoginRegister{ /*position: fixed;*/ position: absolute; z-index: 99999999; width: auto; top: -14px; right: 40px; font-size: 13px; }
	.MenuTopLoginRegister .RegisterLink{ padding: 6px 20px; border: 1px solid #999; margin-right: 5px;}
	.MenuTopLoginRegister .LoginLink{ padding: 6px 20px; border: 1px solid #999; }
	.TopMenu{ width: 100%; max-width: 100%; height: 50px; margin: auto; overflow: hidden; position: relative;}
	.SearchAndMenu{ display: block; }
	.MenuTop{ float: none; width: 100%; height: 50px; margin: 0;}
	/*.SearchTop{ display: none; }*/
	.SearchTopMobile{ display: block; }
	.MenuTop #rwdMenuWrap ul li:nth-child(4):after{ display: none;}
	.LogoTop{ float: none; width: 100px; display: inline-block; max-width: 100px; position: absolute; left: 10px; top:0; margin-top: 0px; z-index: 99999999; text-align: left; padding-top: 12px; }
	.LogoTop a{ margin: 0 auto; width: 100%; display: block;}
	.LogoTop img{ width: 100px; /*width: 40px;*/ position: relative; z-index: 9999999; }
	.LogoPC{ display: none; }
	.LogoMobile{ display: inline-block; }
	.LogoMobileFixed{ display: block; position: absolute; top: 10px; left: 20px; width: 40px; height: auto;}
	/* RightSignupBox */
	.RightSignupBox{ display: block; position: absolute; font-size: 14px; right: 10px; top: 0; margin-top: 0px; width: auto; height: 50px; line-height: 50px; text-align: center; color: #fff; }
	.RightSignupBox a{ padding: 5px 10px 5px 10px!important; margin-left: 10px!important; background-color: #a80000; color: #fff; }
	/* HanBarber Menu */
	#switchBtnArea { display: inline-block; position: relative; z-index: 99999999999; width: 26px; vertical-align: top; }
	#rwdMenuWrap { position: fixed!important; display: inline-block; top: 0!important; right: -100%; z-index: 99999999999; width: 100%; height: 100%; background: #000; }
	#rwdMenuWrap ul { margin-top: 70px!important; width: 100%!important; box-sizing: border-box!important; padding: 3px 17px 0!important; clear: both!important;  vertical-align: top!important; }
	#rwdMenuWrap ul li { position: relative!important; width: 100%!important; margin: 0px!important; padding: 0px!important; height: auto!important; border-bottom: 1px solid #575b6e; vertical-align: top!important; clear: both!important;}
	#rwdMenuWrap ul li a:after { position: absolute; top: 0; margin-top: 20px!important; right: 6px; width: 0; height: 0; margin: -3px 0 0 0; content: ""; border: 3px solid transparent; border-left: 4px solid #fff; vertical-align: top!important; }
	#rwdMenuWrap ul li a { padding: 10px 6px 10px 15px!important; display: block!important; margin: 0px!important; color: #fff!important; text-align: left; font-size: 16px; letter-spacing: .06rem;  }
	#rwdMenuWrap ul li img{ width: 25px; vertical-align: text-bottom; margin-right: 0px; margin-left: -10px; filter: brightness(0) invert(1); }
	#rwdMenuWrap ul li a:hover { border-bottom: 0;}
	/*#rwdMenuWrap ul li:last-child a { text-align: center; padding: 5px 10px 5px 10px!important; font-size: 16px!important; background-color: #a80000; }
	#rwdMenuWrap ul li:last-child a:after { display: none;}
	#rwdMenuWrap ul li:last-child{ border-bottom: 0; width: 110px!important; margin: 0 auto!important; float: none; clear: both!important; display: block; text-align: center; margin-top: 30px!important;}*/
	.AllNavigationBox .Inner{ width: 90%; margin: auto; }
	.ItemList p:nth-child(1){ font-size: 14px;  width: calc(100% - 300px); min-width: 170px; max-width: 170px; }
	.ItemList p:nth-child(2){ font-size: 14px; width: calc(100% - 170px); padding: 5px 10px 5px 10px; }
	.ThreeBox{ width: 32%; font-size: 17px; }
	.ThreeBox span{ font-size: 14px; }
	/* ################################## End Header ################################## */

	/* ################################## Footer ################################## */
	/* footer */
	footer .FooterBox{ max-width: 90%; }
	footer .FooterThreeColumnItemList{ width: 46%; }
	footer .FooterBox .FooterThreeColumnItemList .ItemList p:nth-child(1){ width: auto; float: none; max-width: 100%; padding: 5px 10px; }
	footer .FooterBox .FooterThreeColumnItemList .ItemList p:nth-child(2){ width: auto; float: none; padding-left: 0; padding: 5px 10px 5px 10px; }
	footer .FooterBox .FooterNav{ font-size: 14px; }
	footer .FooterBox .Right{ padding-left: 0px; text-align: left; margin-top: 25px;}
	footer .LogoLinks .LogoF{ width: 30%; margin-bottom: 10px; }
	footer .NavigationFooter ul{ flex-wrap: wrap; justify-content: left; }
	footer .NavigationFooter ul li { font-size: 13px; padding: 10px 15px; }
	/* ################################## End Footer ################################## */

	.Section3Box .Inners{ gap: 2%; }
	.Section3Box .Inners .Links a{ padding: 5px 5px; font-size: 14px; }
	.SectionEnewSNS .Inners .LeftEnews .EnewsText{ font-size: 14px; }
	.SectionEnewSNS .Inners .RightSNS p.HeaderSocial a{ margin: 0 0 0 15px; }
	
}


/* -------------------------------------  767px  ------------------------------------- */
@media(max-width:767px)
{
	.ItemList{ width: 100%; margin-bottom: 15px;}
	.ItemList p:nth-child(1){ margin: 0; font-size: 15px; }
	.ItemList p:nth-child(2){ margin: 0; font-size: 15px; }
	.SearchFormBox{ max-width: 300px; }
	.ThreeBox span{ display: block; }
	.Category2List .CategoryTitle{ font-size: 16px; margin-bottom: 10px;}
	.Category2List .CategoryTitle span{ font-size: 13px; }
	.Category2List ul li{ padding: 0px 0;}
	.Category2List ul li a{ font-size: 15px; padding: 5px;}
	/* ################################## Footer ################################## */
	/* footer */
	footer .FooterBox .FooterNav{ font-size: 13px; }
	footer .LogoLinks .LogoF{ width: 50%;}
	footer .LogoLinks{ font-size: 14px; }
	footer .NavigationFooter{ margin: 20px 0 20px 0;}
	footer .NavigationFooter ul{ flex-wrap: wrap; justify-content: left; }
	footer .NavigationFooter ul li{ font-size: 13px; padding: 5px 10px; }
	/* ################################## End Footer ################################## */

	/* Added 2025.09.05 */
	.DisplayMagazin .NewsletterTop2Column .hbspt-form{ width: 100%; }
	.DisplayMagazin .NewsletterTop input[type="submit"]{ top: 2px; }
	.SPMarginForm{ max-width: 90%; margin: auto;}

	.Section3Box{ margin-top: 0;}
	.Section3Box .Inners{ gap: 0%; display: block; }
	.Section3Box .Inners .Links{ width: 100%; margin-bottom: 10px; }
	.Section3Box .Inners .Links a{ padding: 5px 5px; font-size: 15px; }

	.SectionEnewSNS{ margin: 30px 0 30px 0; }
	.SectionEnewSNS .Inners{ display: block; }
	.SectionEnewSNS .Inners .LeftEnews{ width: 100%; display: block; }
	.SectionEnewSNS .Inners .LeftEnews .EnewsText{ width: 100%; text-align: center; margin-bottom: 20x; }
	.SectionEnewSNS .Inners .RightSNS{ width: 100%; text-align: center; margin-top: 30px; }
	.SectionEnewSNS .Inners .RightSNS p.HeaderSocial{ justify-content: center; }
	.SectionEnewSNS .Inners .RightSNS p.HeaderSocial img{ max-width: 24px; }
	.FirstSP p.HeaderSocial img{ max-width: 26px; }
	
}


/* -------------------------------------  506px  ------------------------------------- */
@media(max-width:506px)
{
	.AllNavigationBox .TLogo{ padding: 15px 0;}
	.AllNavigationBox .TLogo img{ max-width: 160px; max-height: 20px;}
	.AllNavigationBox .Inner{ padding: 30px 0 0 0; height: 95%;}
	.MenuTopLoginRegister{ right: 35px; }
	.LinkMemberShip{ padding: 5px 0px; margin-right: 5px; color: #515254; font-size: 13px; }
	.SearchFormBox{ max-width: 100%; }
	.SearchFormBox button{ right: 0;}
	.ThreeBox{ margin: 15px 0; width: 33%; font-size: 14px; }
	.ThreeBox span{ font-size: 14px;}
	.Category2List ul li{ margin: 0; line-height: 20px;}
	.ItemList p:nth-child(1){ margin: 0; font-size: 14px; }
	.ItemList p:nth-child(2){ margin: 0; font-size: 14px; }
	.InnerSpace .TwoColumn{ display: block; }
	.InnerSpace .TwoColumn .Category2List{width: 100%;}
	/* ################################## Footer ################################## */
	/* footer */
	footer .FooterBox{ padding: 40px 0; }
	footer .FooterBox .FooterLogo{ font-size: 12px; }
	footer .FooterBox .FooterLogo .Text br{ display: block;}
	footer .FooterThreeColumnItemList{ width: 100%; margin-bottom: 30px; }
	footer .FooterBox .FooterThreeColumnItemList .ItemList:nth-child(2){ margin-bottom: 0;}
	footer .FooterBox .FooterThreeColumnItemList .ItemList p:nth-child(1){ width: calc(100% - 170px); float: left; max-width: 170px; padding: 5px 10px; }
	footer .FooterBox .FooterThreeColumnItemList .ItemList p:nth-child(2){ width: calc(100% - 170px); float: left; padding: 5px 10px 5px 10px; }
	footer .FooterBox .FooterThreeColumnItemList .ItemList p:nth-child(2) img{ max-width: 30px; max-height: 30px; margin-right:5px;}
	footer .FooterBox .FooterSocial a.FacebookIcon{ width: 30px; }
	footer .FooterBox .FooterSocial a.TwitterIcon{ width: 30px; }
	footer .FooterBox .FooterSocial a.LineIcon{ width: 30px; }
	footer .FooterBox .FooterSocial a.YoutubeIcon{ width: 30px; }
	/* ################################## End Footer ################################## */

	/* SectionShare */
	.SectionShare{ width: 45px; top: auto; bottom: 10px; }
	.SectionShare .Title{ font-size: 10px; font-weight: 600; }
	.SectionShare ul li a{ width: 32px; height: 32px; }
	.SectionShare ul li .XClass img{ max-width: 20px; max-height: 20px; }
	.SectionShare ul li .FacebookClass img{ max-width: 20px; max-height: 20px; }
	.SectionShare ul li .LineClass img{ max-width: 20px; max-height: 20px; }
	.SectionShare ul li .PinterestClass img{ max-width: 20px; max-height: 20px; }
	.SectionShare ul li .LinkClass img{ max-width: 20px; max-height: 20px; }
	.SectionShare ul li .TextClass img{ max-width: 20px; max-height: 20px; }
}