@charset "utf-8";

/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
Twitter: @rich_clark
*/

html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,abbr, address, cite, code,del, dfn em, img, ins, kbd, q, samp,small, strong, sub, sup, var,b, i,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,able, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, figcaption, figure, footer, header,hgroup, menu, nav, section, summary,time, mark, audio, video {margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;}
body {line-height:1;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display:block;}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after,q:before, q:after {content:'';content:none;}
ins { background-color:#ff9;color:#000;text-decoration:none;}
mark {background-color:#ff9;color:#000;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;}
hr {display:block;height:1px;border:0;border-top:1px solid #cccccc;margin:1em 0;padding:0;}
input, select {vertical-align:middle;}

a {
    color: #11c;
    font-size: 100%;
    vertical-align: baseline;
    margin: 0;
    padding: 0;
    background: transparent;
}

a:hover {
    color: #65c0f5;
    text-decoration: none;
}

img {
    vertical-align: top;
}

@media screen and (max-width: 767px) {
    img {
        max-width: 100%;
        height: auto;
    }
}

p {
    margin-bottom: 1.2em;
}

small, .small {
    font-size: 12px;
}

/* Clearfix */
.clearfix {
    zoom: 1;
}

.clearfix:after {
    content: "";
    display: block;
    clear: both;
}

/* Float */
.left {
    float: left;
}

.right {
    float: right;
}

.clear {
    clear: both;
}

img.left {
    margin: 0 14px 14px 0;
}

img.right {
    margin: 0 0 14px 14px;
}

@media screen and (max-width: 767px) {
    .left,
    .right {
        float: none;	
    }
    
    img.left,
    img.right {
        display: block;
        margin-right: auto;
        margin-left: auto;	
    }
}

/* Text-align */
.t-left {
    text-align: left;
}

.t-right {
    text-align: right;
}

.center {
    text-align: center;
}

/* テーブル */
.bordered-table {
    width: 100%;
    margin-bottom: 14px;    
}

.bordered-table th,
.bordered-table td {
    vertical-align: middle;
    padding: 10px 14px;
    border: 1px solid #ccc; 
    background: #fff;
}

.bordered-table th {
    text-align: left;
    background: #eee;
}

@media screen and (max-width: 767px) {
    .bordered-table th,
    .bordered-table td {
        padding: 5px 10px;
    }

    .bordered-table th {
        white-space: normal;
        background-color: #eee;
    }

    .bordered-table.list th,
    .bordered-table.list td {
        display: block;
        padding: 5px;
    }

    .bordered-table.list th {
        border-top-width: 0;
        border-bottom-width: 0;
    }

    .bordered-table.list tr:first-child th {
        border-top-width: 1px;
    }
}

/* ボーダーボックス */
.bordered {
    padding: 10px;
    border: 3px double #ffa647;
    background: #fff;
}

.bordered p:last-child {
    margin-bottom: 0;   
}

/* 注釈 */
.note {
    font-size: 12px !important;
}

.pr {
    color: #f00;    
}

/* 矢印リンク */
.arrow {
    padding-left: 20px;
    background: url(../images/icon_arrow.gif) left center no-repeat;
}

[target="_blank"] {
    padding-right: 18px;
    background: url(../images/icon_blank_arrow.gif) right center no-repeat;
}


/* リスト */
ul,
ol {
    margin: 0 0 1.2em 1.8em;    
}

.disc {
    list-style: disc;   
}

table ul:last-child,
table ol:last-child {
    margin-bottom: 0;   
}

/* チェックリスト */
.check {
    list-style: none;
    margin-left: 0;
}

.check li {
    margin-bottom: 2px;
    padding-left: 22px;
    background: url(../images/icon_check.png) left center no-repeat;    
}

.hidden-pc {
    display: none;
}

@media screen and (max-width: 767px) {
    .hidden-pc {
        display: block;
    }
    
    .hidden-sp {
        display: none;
    }
}

body {
    color: #333;
    font: 14px/1.4 Meiryo,"メイリオ","MS PGothic","ＭＳ Ｐゴシック",sans-serif;
    background: #fff;
    -webkit-text-size-adjust: 100%;
}

.global-header,
.main-visual,
.content,
.global-footer {
    width: 940px;
    margin: 0 auto;
    padding: 0 10px;
}

.global-footer {
    width: 920px;
}

@media screen and (max-width: 767px) {
    .wrapper {
        padding: 0 10px;	
    }

    .global-header,
    .main-visual,
    .content,
    .global-footer {
        width: 100%;
        padding: 0;
    }
}


/*==================================================

.global-header

==================================================*/
.global-header {
    margin-bottom: 5px;
    padding: 5px 10px;
}

.global-header .logo {
    width: 365px;
    float: left;
}

.global-header .logo img {
    width: 100%;
    height: auto;   
}

@media screen and (max-width: 767px) {
    .global-header {
        margin-bottom: 10px;
        padding: 10px 0 0;
    }

    .global-header .logo {
        width: 100%;
        float: none;
        text-align: center;
        margin: 0 0 5px 0;	
    }
}

/*==================================================

.main-visual

==================================================*/
.main-visual {
    margin-bottom: 20px;
}

.main-visual > div {
    margin-bottom: 10px;
}

@media screen and (max-width: 767px) {
    .main-visual {
        text-align: center;
        margin-bottom: 20px;
    }

    .main-visual .site-desc {
        color: #333;
        text-align: left;
        padding: 10px 0;
        background: #fff;	
    }
}

/*==================================================

.content

==================================================*/
.content {
    margin-bottom: 20px;
}

section {
    margin-bottom: 40px;
    background: #fafafa;
}

section section {
    margin-bottom: 20px;
}

section > .inner {
    padding: 20px;
}

section .inner > *:last-child {
    margin-bottom: 0;
}

/* headline */
h2 {
    color: #fff;
    font-size: 28px;
    padding: 13px 20px 10px;
    background: #1472ff;
}

h3 {
    color: #1472ff;
    font-size: 20px;
    line-height: 24px;
    margin: 20px 0 10px;
    padding-bottom: 2px;
    border-bottom: 2px solid #1472ff;   
}

h4 {
    font-size: 16px;
    margin: 18px 0 10px;
}

h3 + h4 {
    margin-top: 0;  
}

@media screen and (max-width: 767px) {
    section {
        margin-bottom: 30px;
        background: #fff;	
    }

    section > .inner {
        padding: 10px 0;	
    }

    .bordered-section .inner {
        padding: 10px;
    }

    /* headline */
    h2 {
        font-size: 18px;
        line-height: 22px;
        padding: 10px;
    }

    h3 {
        font-size: 16px;
        line-height: 20px;
    }

    h4 {
        font-size: 14px;	
    }
}

/* 
.flow
==================================================*/
.flow [class^=f-step] {
    min-height: 180px;
    margin-bottom: 20px;
    padding-bottom: 40px;
    padding-left: 220px;
    position: relative;
}

.flow [class^=f-step]:last-child,
.flow p {
    margin-bottom: 0;   
    padding-bottom: 0;   
}

.flow h3 {
    height: 45px;
    color: #fff;
    line-height: 45px;
    margin-top: 0;
    padding: 0 10px;
    border: 0;  
    background: #ff9a37;
}

.flow .f-step01 {
    background: url(../images/flow_step01.jpg) left top no-repeat;
}

.flow .f-step02 {
    background: url(../images/flow_step02.jpg) left top no-repeat;
}

.flow .f-step03 {
    background: url(../images/flow_step03.jpg) left top no-repeat;
}

.flow .f-step04 {
    background: url(../images/flow_step04.jpg) left top no-repeat;
}

/* 矢印 */
.flow [class^=f-step]:after {
    position: absolute;
    bottom: -5px;
    left: 50%;
    content: "";
    width: 0;
    height: 0;
    margin-left: -16px;
    border: 16px solid transparent;
    border-top-color: #ffcc00
}

.flow [class^=f-step]:last-child:after {
    border: 0;	
}

@media screen and (max-width: 767px) {
    .flow [class^=f-step] {
        min-height: 0;
        margin-bottom: 0;
        padding-left: 110px;
        background-size: 100px auto;
    }

    .flow [class^=f-step]:last-child,
    .flow p {
        margin-bottom: 0;	
    }

    .flow [class^=f-step]:last-child {
        padding-bottom: 0;	
    }

    .flow h3 {
        height: auto;
        color: #fff;
        line-height: inherit;
        margin-top: 0;
        padding: 5px 10px;
        border: 0;	
        background: #ff9a37;
    }
}

.price {
    text-align: right;
    white-space: nowrap;
    margin: 0;
}

.pack {
    padding-left: 270px;
    background: url(../images/pack_basic.jpg) left top no-repeat;    
}

.pack-omakase {
    background-image: url(../images/pack_omakase.jpg);  
}

.pack-full {
    background-image: url(../images/pack_full.jpg);  
}

@media screen and (max-width: 767px) {
    .pack {
        padding: 210px 0 0;
        background-position: center top;	
    }
}

/*==================================================

.global-footer

==================================================*/
.global-footer {
    color: #fff;
    font-size: 12px;
    padding: 10px;
    overflow: hidden;
    background: #1472ff;
}

.global-footer a {
    color: #fff;
    text-decoration: underline;
}

.global-footer p {
    margin-bottom: 0;   
}

.global-footer .copyright {
    float: left;
}

.global-footer .privacy {
	float: right;	
}

.global-footer .privacy a {
	display: inline-block;
}

.global-footer .privacy a:not(:last-child) {
	margin-right: 1em;
}

.global-footer [target="_blank"] {
    background: url(../images/icon_blank_w_arrow.gif) right center no-repeat;
}

@media screen and (max-width: 767px) {
    .global-footer {
        box-sizing: border-box;
        padding: 10px;
    }
    
    .global-footer .privacy {
        float: none;
    }

    .global-footer .privacy a {
        margin-top: 1em;
    }
}