
.box:after, #n-header:after, #n-header-background:after, #n-header-message-area:after, #n-content:after, #n-content #n-main:after, #n-content #n-main #n-list-header:after, #n-content #n-main #n-list-header-background:after, .main-wrapper:after, .main-flip-wrapper:after, .partial-area:after, .partial-area .partial-area-header:after, .partial-area .partial-area-body:after, .partial-area .partial-area-footer:after, .item-list:after, .nav-panel .nav-group:after, .nav-panel .nav-group .nav-title:after, .nav-panel .nav-group .nav-item-list:after, #n-footer:after, #n-main.page-package-detail .buy-area .campaign-info:after, #n-main.page-package-edit-review .buy-area .campaign-info:after, #n-main.page-package-report-review .buy-area .campaign-info:after, .overlay-background .pack-info-area .pack-info-area-header:after, .overlay-background .pack-info-area .pack-info-area-body:after, .overlay-background .pack-info-area .pack-info-area-footer:after, .overlay-background .pack-info-area .pack-info-area-body .pack-info-detail .info-detail-header:after, .overlay-background .pack-info-area .pack-info-area-body .pack-info-detail .info-detail-footer:after {
  clear: both;
  content: "";
  display: block;
}

.page-wrapper {
  display: none;
}


@media only screen
and (max-device-width: 320px)
and (orientation: portrait) {

  div.block {
    display: table;
    margin: 10px 0 0 0;
    position: absolute;
  }

  div.block2 {
    float: right;
    display: table;
    margin: 5px 0 0 270px;
    position: absolute;
  }

  .page-wrapper {
    margin: 0 auto;
  }

  div.block2 #header-menu-list {
    float: right;
    width: 100px;
    margin: 0 0 0 -50px;
  }

  #n-header .header-menu-list ul#search-menu-link li {
    float: left;
  }

  #n-header .header-menu-item .header-menu-item-link .header-menu-item-text {
    display: none;
  }

  #n-header .header-menu-item {
    display: inline-block;
    float: left;
    height: 48px;
    position: relative;
    width: 48px;
  }

  div.block2 li#account-menu-link {
    float: left;
  }

  div.block2 li#search-menu-link {
    float: left;
  }

  .icon-header-menu.icon-menu-main {
    background-position: -159px -4px;
  }

  .icon-header-menu {
    background: url('./img/buttons/rootmenubk.png') no-repeat scroll 0 0 / 212px 58px transparent;
    display: inline-block;
    float: left;
    height: 48px;
    text-decoration: none;
    width: 48px;
  }


  .icon-header-menu.icon-menu-search {
    background: url('./img/buttons/rootmenubk.png') no-repeat scroll -50px 0 / 212px 58px transparent;
    display: inline-block;
    float: left;
    height: 48px;
    text-decoration: none;
    width: 48px;
  }

  span.header-menu-item-text {
    display: none;
  }

  #main-menu-link span.icon-header-menu {
    display: block;
    height: 48px;
    width: 48px;
    float: left;

  }

  #main-menu-link span.header-menu-item-text {
    display: block;
    height: 48px;
    width: 48px;
    float: left;
    margin: 30px 0 0 0;
  }

  #main-menu-link span.icon-menu-account {
    display: block;
    height: 48px;
    width: 48px;
    float: right;
    margin: 30px 0 0 0;
  }


  .search-panel {
    background-color: white;
    padding: 5px;
    width: 100%;
  }

  .search-panel .search-panel-form {
    background: #fff;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: table;
    height: 30px;
    margin: 0;
    table-layout: fixed;
    width: 100%;
  }


  .search-panel .search-panel-form .search-sectionid-area, .search-panel .search-panel-form .search-text-area, .search-panel .search-panel-form .btn-search-area {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: table-cell;
    height: 30px;
    vertical-align: top;
  }

  .search-panel .search-panel-form .search-text-area .search-text {
    border-style: solid none;
    -webkit-border-radius: 0 0;
    -moz-border-radius: 0 / 0;
    border-radius: 0 / 0;
    height: 28px;
    width: 100%;
  }

  .search-panel .search-panel-form .search-text-area .search-text {
    border-style: solid none;
    -webkit-border-radius: 0 0;
    -moz-border-radius: 0 / 0;
    border-radius: 0 / 0;
    height: 28px;
    width: 100%;
  }

  .search-sectionid-area {
    width: 60px;
  }

  .select-sz01, .search-sectionid {
    font-size: 1.0rem;
    line-height: 2;
    height: 30px;
    width: 89px;
    float: left;
  }

  .search-text-area {
    width: 100px;
  }

  .search-panel .search-panel-form .btn-search-area .btn-search {
    height: 30px;
    width: 100%;
  }

  .search-panel .search-panel-form .btn-search-area {
    width: 50px;
  }

  .btn-search {
    -webkit-background-size: 12px 12px;
    -moz-background-size: 12px 12px;
    -o-background-size: 12px 12px;
    background-size: 12px 12px;
  }


}

@media only screen
and (min-device-width: 320px)
and (max-device-width: 568px)
and (orientation: landscape) {

  div.block {
    display: table;
    margin: 10px 0 0 0;
    position: absolute;
  }

  div.block2 {
    float: right;
    display: table;
    margin: 5px 0 0 460px;
    position: absolute;
  }

  .page-wrapper {
    margin: 0 auto;
  }

  div.block2 #header-menu-list {
    float: right;
    width: 100px;
    margin: 0 0 0 0;
  }

  #n-header .header-menu-list ul#search-menu-link li {
    float: left;
  }

  #n-header .header-menu-item .header-menu-item-link .header-menu-item-text {
    display: none;
  }

  #n-header .header-menu-item {
    display: inline-block;
    float: left;
    height: 48px;
    position: relative;
    width: 48px;
  }

  div.block2 li#account-menu-link {
    float: left;
  }

  div.block2 li#search-menu-link {
    float: left;
  }

  .icon-header-menu.icon-menu-main {
    background-position: -159px -4px;
  }

  .icon-header-menu {
    background: url('./img/buttons/rootmenubk.png') no-repeat scroll 0 0 / 212px 58px transparent;
    display: inline-block;
    float: left;
    height: 48px;
    text-decoration: none;
    width: 48px;
  }


  .icon-header-menu.icon-menu-search {
    background: url('./img/buttons/rootmenubk.png') no-repeat scroll -50px 0 / 212px 58px transparent;
    display: inline-block;
    float: left;
    height: 48px;
    text-decoration: none;
    width: 48px;
  }

  span.header-menu-item-text {
    display: none;
  }

  #main-menu-link span.icon-header-menu {
    display: block;
    height: 48px;
    width: 48px;
    float: left;

  }

  #main-menu-link span.header-menu-item-text {
    display: block;
    height: 48px;
    width: 48px;
    float: left;
    margin: 30px 0 0 0;
  }

  #main-menu-link span.icon-menu-account {
    display: block;
    height: 48px;
    width: 48px;
    float: right;
    margin: 30px 0 0 0;
  }


  .search-panel {
    background-color: white;
    padding: 5px;
    width: 100%;
  }

  .search-panel .search-panel-form {
    background: #fff;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: table;
    height: 30px;
    margin: 0;
    table-layout: fixed;
    width: 100%;
  }


  .search-panel .search-panel-form .search-sectionid-area, .search-panel .search-panel-form .search-text-area, .search-panel .search-panel-form .btn-search-area {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: table-cell;
    height: 30px;
    vertical-align: top;
  }

  .search-panel .search-panel-form .search-text-area .search-text {
    border-style: solid 1px #000;
    -webkit-border-radius: 0 0;
    -moz-border-radius: 0 / 0;
    border-radius: 0 / 0;
    height: 28px;
    width: 100%;
  }

  .search-panel .search-panel-form .search-text-area .search-text {
    border-style: solid 1px #000;
    -webkit-border-radius: 0 0;
    -moz-border-radius: 0 / 0;
    border-radius: 0 / 0;
    height: 28px;
    width: 100%;
  }

  .search-sectionid-area {
    width: 60px;
  }

  .select-sz01, .search-sectionid {
    font-size: 1.0rem;
    line-height: 2;
    height: 30px;
    width: 89px;
    float: left;
  }

  .search-text-area {
    width: 190px;
  }

  .search-panel .search-panel-form .btn-search-area .btn-search {
    height: 30px;
    width: 100%;
  }

  .search-panel .search-panel-form .btn-search-area {
    width: 50px;
  }

  .btn-search {
    -webkit-background-size: 12px 12px;
    -moz-background-size: 12px 12px;
    -o-background-size: 12px 12px;
    background-size: 12px 12px;
  }

}

@media (max-width: 640px) {

  .box, #n-header, #n-header-background, #n-header-message-area, #n-content, #n-content #n-main, #n-content #n-main #n-list-header, #n-content #n-main #n-list-header-background, .main-wrapper, .main-flip-wrapper, .partial-area, .partial-area .partial-area-header, .partial-area .partial-area-body, .partial-area .partial-area-footer, .item-list, .nav-panel .nav-group, .nav-panel .nav-group .nav-title, .nav-panel .nav-group .nav-item-list, #n-footer, #n-main.page-package-detail .buy-area .campaign-info, #n-main.page-package-edit-review .buy-area .campaign-info, #n-main.page-package-report-review .buy-area .campaign-info, .overlay-background .pack-info-area .pack-info-area-header, .overlay-background .pack-info-area .pack-info-area-body, .overlay-background .pack-info-area .pack-info-area-footer, .overlay-background .pack-info-area .pack-info-area-body .pack-info-detail .info-detail-header, .overlay-background .pack-info-area .pack-info-area-body .pack-info-detail .info-detail-footer {
    display: block;
    overflow: hidden;
    width: 100%;
  }


  #n-header .header-menu-item {
    display: inline-block;
    float: left;
    height: 48px;
    position: relative;
    width: 48px;
  }


  #n-header .header-menu-item .header-menu-item-link {
    display: inline-block;
    height: auto;
    width: 100%;
  }

  a, a:visited {
    color: #03f;
    text-decoration: none;
    text-shadow: none;
  }

  .icon-header-menu.icon-menu-main {
    background-position: -159px -4px;
  }


  #n-header .header-menu-item .header-menu-item-link .header-menu-item-text {
    display: none;
  }

  #nav-panel-main.nav-panel {
    text-align: center;
  }

  .nav-panel {
    background-color: #eee;
  }

  .mypage {
    background-color: #fff !important;
  }

  .account {
    background-color: #fff !important;
  }

  .nav-panel a {
    color: #696969;
    display: block;
    height: 28px;
    margin: -11px 0 0 -15px;
    padding: 11px 15px 10px;
    width: 100%;
  }

  .two-col a {
    width: 218px;
    margin: 0 auto;
    color: #696969;
    display: block;
    padding: 0;
  }

  li.nav-item {
    display: block;
    padding: 5px 0;
  }


  .nav-panel {
    width: 270px;
    /*width: 100%;*/
  }

  .nav-item-text1 {
    color: #808080;
  }

  .nav-item-text2 {
    color: #808080;
  }

  .navi-title {
    color: #696969 !important;

  }

  .panel, .nav-panel, .search-panel {
    box-sizing: border-box;
    overflow-y: auto;
    top: 64px;
  }

  .nav-panel2 {
    width: 75%;
  }

  .panel, .nav-panel2, .search-panel {
    box-sizing: border-box;
    overflow-y: auto;
    top: 64px;
  }

  .nav-panel2 .nav-group {
    width: 100%;
  }

  .nav-group a:hover {
    text-decoration: none;
  }

  .nav-panel2 .nav-item-list {
    width: 100%;
  }


  .nav-panel .nav-group .nav-item-list .nav-item.two-col {
    width: 100%;
  }

  .nav-panel .nav-group .nav-item-list .nav-item {
    display: inline-table;
    background-color: #ccc;
    border-color: #999999;
    border-style: none none solid;
    border-width: 1px;
    box-sizing: border-box;
    float: left;
    font-size: 1.4rem;
    height: 30px;
    line-height: 2.5;
    padding: 0 0 5px 0;
    vertical-align: middle;
  }

  #n-header h1, #n-header h2, #n-header h3, #n-header h4, #n-header h5, #n-header h6, #n-header ol, #n-header ul, #n-header li, #n-header p, #n-footer h1, #n-footer h2, #n-footer h3, #n-footer h4, #n-footer h5, #n-footer h6, #n-footer ol, #n-footer ul, #n-footer li, #n-footer p, .nav-panel h1, .nav-panel h2, .nav-panel h3, .nav-panel h4, .nav-panel h5, .nav-panel h6, .nav-panel ol, .nav-panel ul, .nav-panel li, .nav-panel p {
    margin: 0;
    padding: 0;
  }

  .nav-panel .nav-group .nav-item-list .nav-item {
    background-color: #eee;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    font-size: 1rem;
    height: 50px;
    line-height: 1.5;
    padding: 14px 5px 0;
    vertical-align: middle;
    width: 100%;
    text-align: center;
  }

  .nav-panel2 {
    background-color: #FFF;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    float: left;
    font-size: 1rem;
    height: auto;
    line-height: 1.5;
    vertical-align: middle;
    text-align: center;
    width: 80%; /*80%*/
    max-width: 300px;
    padding: 12px 0 0;
  }

  .nav-panel2 span {
    font-size: 1rem;

  }

  .nav-panel2 ul {
    margin: 0 auto;
    font-size: 1rem;

  }

  .navi-cart {
    background: url("./img/itemdetail/head_carticon3.png") no-repeat scroll 75px 2.5px;
    padding-left: 27px;
  }

  .nav-panel2 li.all {
    width: 218px;
    margin: 0 auto 6px auto;
    padding: 5px 0;
  }

  .nav-panel2 .nav-group .nav-item-list .nav-item span {
    background: #f3f3f3;
    display: block;
    height: auto;
    margin: 0 auto 0;
    padding: 5px 0;
    width: 218px; /*90%*/
  }

  .nav-panel2 .nav-group .nav-item-list .nav-item span.comic {
    background-color: #069CE9;
    color: #fff;
  }

  .nav-panel2 .nav-group .nav-item-list .nav-item span.menu-top {
    background: #f3f3f3;
  }

  .nav-panel2 .nav-group .nav-item-list .nav-item span.menu-top {
    background: #f3f3f3;
  }

  .nav-panel2 .nav-group .nav-item-list .nav-item span.bbc, .nav-panel2 .nav-group .nav-item-list .nav-item span.ngc, .nav-panel2 .nav-group .nav-item-list .nav-item span.mytheater {
    text-indent: -9999px;
  }

  .nav-panel2 .nav-group .nav-item-list .nav-item p.bbc {
    display: block;
    height: 34px;
    margin: -34px auto 0;
    padding: 0;
    width: 218px;
    background: url("./img/header/menu_bbc.png") no-repeat scroll center 16px transparent;
  }

  .nav-panel2 .nav-group .nav-item-list .nav-item p.ngc {
    display: block;
    height: 34px;
    margin: -34px auto 0;
    padding: 0;
    width: 218px;
    background: url("./img/header/ngc_menu.png") no-repeat scroll center 8px transparent;
  }

  .nav-panel2 .nav-group .nav-item-list .nav-item p.mytheater {
    display: block;
    height: 34px;
    margin: -34px auto 0;
    padding: 0;
    width: 218px;
    background: url("./img/header/mytheater_menu.png") no-repeat scroll center 12px transparent;
  }


  .mailmagazine a {
    padding: 0;
  }


  .nav-panel2 .nav-group .nav-item-list .nav-item span.mailmagazine {
    background: url("./img/icon/icon_mailmag.png") no-repeat scroll 42px -5px;
    color: #ff3366;
    width: 182px;
    padding: 0 0 0 36px;
  }

  ul.sns_group {
    display: inline-block;
    width: 218px;
    height: 32px;
    margin: 0 auto;
    clear: both;
  }

  li.sns {
    display: inline-block;
    width: auto;
    height: auto;
  }

  li.sns a {
    display: inline-block;
    width: auto;
    height: auto;
  }

  .sns span.official-blog {
    float: left;
    color: #fff;
    background: #069CE9;
    display: block;
    height: auto;
    margin: 0 2px 0 0;
    padding: 4px 0;
    width: 64px;
  }

  .sns span.twitter {
    float: left;
    color: #fff;
    background: #000;
    display: block;
    height: auto;
    margin: 0 3px;
    padding: 4px 0;
    width: 64px;
  }

  .sns span.facebook {
    float: left;
    color: #fff;
    background: #43609C;
    display: block;
    height: auto;
    margin: 0 0 0 2px;
    padding: 4px 0;
    width: 64px;
  }

  .nav-panel .nav-group .nav-item-list .nav-item ul {
    display: inline-block;
    height: auto;
    padding: 10px 0 0;
    width: 100%;
  }

  .nav-panel .nav-group .nav-item-list .nav-item li {
    background: none repeat scroll 0 0 #eee;
    display: inline-block;
    float: left;
    font-size: 0.8rem;
    height: 28px;
    line-height: 1.1;
    margin: 0 1px 10px 5px;
    padding: 11px 15px 10px;
    text-align: center;
    vertical-align: middle;
    width: 36%;
  }

  .nav-panel .nav-group .nav-item-list .nav-item li span.nav-item-text {
    display: block;
    padding: 6px 0 0 0;
    margin: 0;
  }

  .nav-panel .nav-group .nav-item-list .nav-item li span.nav-item-text2 {
    display: block;
    padding: 0;
    margin: 0;
  }

  .nav-panel .nav-group .nav-item-list .nav-item li span.nav-item-text3 {
    display: block;
    padding: 0;
    margin: 0;
  }


  #top .menu-sp-list {
    border-top: solid 3px #E3DEC2;
    border-bottom: solid 3px #E3DEC2;
    background: none repeat scroll 0 0 #F3F1E2;
    margin: 0 auto 20px;
    padding: 10px 0;
    color: #333;
    width: 100%;
    height: auto;
    list-style: none;
  }

  #top .menu-sp-list p {
    background: none repeat scroll 0 0 #F3F1E2;
    font-size: 16px;
    width: 218px;
    margin: 0 auto 5px auto;
    text-align: center;
  }

  #top .menu-sp-list li {
    background: none repeat scroll 0 0 #F3F1E2;
    width: 100%;
    margin: 0 auto;
    padding: 0;
    text-align: center;
  }

  .res_sp_banner p {
    width: auto;
    margin: 0 auto 5px auto;
    padding: 0;
    text-align: center;
  }

  .res_sp_banner p.sp-list-title {
    background: #f3f3f3;
    font-size: 16px;
    color: #333;
  }

  #alpha .res_sp_banner p.sp-list-title {
    background: #F3F1E2;
    font-size: 14px;
    color: #333;
  }

  .nav-item .two-col2 .right-col .selected .menu-sp-list li {
    background: #f3f3f3;
  }

  .nav-group .border {
    clear: both;
    width: 219px;
    margin: 12px auto;
    border-bottom: 1px dotted #BABABA;
  }

  .menu-mailmagazine {
    margin: 0 0 12px;
  }

  .menu-mailmagazine span {
    color: #696969;
    font-size: 0.8rem;
    margin: 0;
  }

  .menu-sokmil-link {
    clear: both;
    margin: 0 0 12px;
  }

  .menu-sokmil-link a {
    padding: 2px 50px;
    width: auto;
  }

  .menu-sokmil-link span {
    color: #696969;
    font-size: 0.9rem;
    margin: 0;
  }


  #n-header h1, #n-header h2, #n-header h3, #n-header h4, #n-header h5, #n-header h6, #n-header ol, #n-header ul, #n-header li, #n-header p, #n-footer h1, #n-footer h2, #n-footer h3, #n-footer h4, #n-footer h5, #n-footer h6, #n-footer ol, #n-footer ul, #n-footer li, #n-footer p, .nav-panel h1, .nav-panel h2, .nav-panel h3, .nav-panel h4, .nav-panel h5, .nav-panel h6, .nav-panel ol, .nav-panel ul, .nav-panel li, .nav-panel p {
    margin: 0;
    padding: 0;
  }


  /* 2014/10/22 */
  #btn-open-footer {
    display: none;
    font-size: 0;
  }

  #n-footer {
    background-color: #eeeeee;
    border-color: #999999;
    border-style: solid none none;
    border-width: 1px;
    color: #333333;
    text-align: center;
  }

  #n-footer {
    position: fixed !important;
    bottom: 0;
    z-index: 900;
  }

  #n-footer #go-to-pagetop {
    display: block;
    color: #333333;
    font-size: 1.2rem;
    line-height: 2.5;
  }

  #n-footer .switch-view-mode-box {
    clear: both;
    height: 35px;
    width: 100%;
  }

  #n-footer .switch-view-mode-box .switch-mode-list {
    background-color: #cccccc;
    clear: both;
    height: 35px;
    text-align: center;
    width: 100%;
  }

  .ui-body-a .ui-link {
    color: #0033ff;
    text-decoration: none;
    text-shadow: none;
  }

  .btn-close-footer {
    background-image: url('/img/mobile/icons-s1d2a997b02.png');
    background-position: 0 -558px;
    background-repeat: no-repeat;
    -webkit-background-size: 84px auto;
    -moz-background-size: 84px auto;
    -o-background-size: 84px auto;
    background-size: 84px auto;
    display: inline-block;
    height: 50px;
    text-decoration: none;
    width: 50px;
  }


  #n-header ol, #n-header ul, #n-footer ol, #n-footer ul, .nav-panel ol, .nav-panel ul {
    list-style: none;
  }

  #n-footer .switch-view-mode-box .switch-mode-list .switch-mode-item {
    color: #333333;
    display: inline-block;
    height: 24px;
    margin: 5px 2px 4px;
    width: 64px;
  }

  .switch-mobile {
    -webkit-border-radius: 12px 12px;
    -moz-border-radius: 12px 0 0 12px / 12px 0 0 12px;
    border-radius: 12px 0 0 12px / 12px 0 0 12px;
  }

  #n-footer .nav-footer-list .nav-footer-item {
    display: inline-block;
    color: #333333;
    font-size: 1.2rem;
    line-height: 1.5;
    margin: 0 6px;
  }

  #n-footer .copyright-area {
    background-color: #666666;
    color: white;
    font-size: 1.2rem;
    height: 24px;
    line-height: 2;
    text-align: center;
    width: 100%;
  }

  small {
    line-height: 2em;
    font-size: 1.1em;
  }

  small h3 {
    line-height: 1em;
    font-size: 1em;
  }

  small ol {
    line-height: 1em;
    font-size: 1em;
  }

  #nav-panel-account {
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
  }
}

/* 2014/10/22 */
