@charset "UTF-8";

/*------------------------------------------------------------
	base
------------------------------------------------------------ */
@font-face {
   font-family: MyWebFont;
   src: url('eurof55.ttf');
}
body { margin: 0px; padding: 0px; font: 14px/2 MyWebFont, "Yu Gothic", YuGothic, "游ゴシック体", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", "Lucida Grande", "Geneva", "Arial", "Verdana", sans-serif; height: 100%; background-color:#fff; }
h1,h2,h3,h4,h5,p,ul,ol,li,dl,dt,dd,form,figure{ margin: 0px; padding: 0px; }
ul { list-style-type: none; }
input,textarea,select { font-size: 1em; }
form { margin: 0px; }
table {	border-collapse:collapse; font-size: 100%; border-spacing: 0; }
/*link*/
a:link, a:visited { border: 0; text-decoration: none; }
a:hover { text-decoration: none;}
a.textlink { color:#e52c65; text-decoration:underline; }
a.textlink:hover { text-decoration: none; }
a.boxlink { font-size:16px; color:#444; padding: .4em 1.5em .5em 2.4em; border:1px solid #ccc; margin-top:1.5em; display: inline-block; text-decoration:none !important; }
a.boxlink:hover { background:#ccc; }
/*text*/
h1, h2, h3, h4, h5, h6 { text-align: left; line-height:1.2; line-break: strict; color: #343370; font-weight: bold; margin-bottom:.5em; }
h1 { font-size: 20px; }
h2 { font-size: 32px; }
h3 { font-size: 20px; margin-bottom:1em; }
h4 { font-size: 18px; }
h5 { font-size: 16px; }
h6 { font-size: 18px; line-height:1.7; font-weight:normal; }
p { font-size: 14px; line-height: 2.2; font-weight: normal; color: #343370;  }
.point { color:#9774aa !important; }
.caption { font-size : -webkit-calc(1em - 2px) ; font-size : calc(1em - 2px); line-height:1; }
.caution { color:#e52c65; }
.textC { text-align:center !important; }
.textL { text-align:left !important; }
.textR { text-align:right !important; }
.cFFF { color:#fff !important; }
blockquote { font-size:16px; }
h2.read { margin-bottom:15px; }
p.read { font-size:16px; margin-bottom:45px; }
i { padding-right:.4em; font-size : -webkit-calc(1em + 1px) ; font-size : calc(1em + 1px) ; }
.mwf {font-family: MyWebFont;}

/*strong*/
strong { color:#222; font-weight: bold; }
b { font-weight: bold; }
em, i { font-style: italic; }
.normal { font-weight:normal; }

/* IMG */
img { margin:0; padding:0; border: 0; }
img.center { display:block; margin:0 auto; }
img.left { float: left; margin: 0 15px 0 0; border: 0; }
img.left0 { float: left; margin:0; border: 0; }
img.lefttop { float: left; margin: 2px 20px 20px 0; border: 0; }
img.right { float: right; margin: 0 0 0 15px; border: 0; }
img.right0 { float: right; margin: 0; border: 0; }
img.righttop { float: right; margin: 2px 0 20px 20px; border: 0; }
a:hover img { opacity:.70; transition: all .3s ease-in-out; }
.w100 { width:100%; }
.wMax100 { max-width:100%; }

/* LIST */
ul { margin-bottom: 0; list-style: none outside; }
ol { margin-bottom: 0; list-style: decimal; margin-left: 2.2em; }
ul.square, ul.circle { margin-left: 2em; }
ul.square { list-style: square outside; }
ul.circle { list-style: circle outside; }
ul ul.circle, ul ul.square { margin-top: 4px; margin-bottom: 5px; }

/* HR */
hr { border-width: 1px 0 0 0; border-style: solid; border-color: #bdc3c7; height: 1px; margin:0 0 60px; }
hr.dot { border-width: 1px 0 0 0; border-style: dotted; border-color: #ccc; height: 1px; }
hr.dash { border-width: 1px 0 0 0; border-style: dashed; border-color: #ccc; height: 1px; }


/* Margin */
.btmMgn0 { margin-bottom:0 !important; }
.btmMgn5 { margin-bottom:5px !important; }
.btmMgn10 { margin-bottom:10px !important; }
.btmMgn15 { margin-bottom:15px !important; }
.btmMgn20 { margin-bottom:20px !important; }
.btmMgn25 { margin-bottom:25px !important; }
.btmMgn30 { margin-bottom:30px !important; }
.btmMgn35 { margin-bottom:35px !important; }
.btmMgn40 { margin-bottom:40px !important; }
.btmMgn45 { margin-bottom:45px !important; }
.btmMgn50 { margin-bottom:50px !important; }
.btmMgn55 { margin-bottom:55px !important; }
.btmMgn60 { margin-bottom:60px !important; }

.topMgn0 { margin-top:0 !important; }
.topMgn5 { margin-top:5px !important; }
.topMgn10 { margin-top:10px !important; }
.topMgn15 { margin-top:15px !important; }
.topMgn20 { margin-top:20px !important; }
.topMgn25 { margin-top:25px !important; }
.topMgn30 { margin-top:30px !important; }
.topMgn35 { margin-top:35px !important; }
.topMgn40 { margin-top:40px !important; }
.topMgn45 { margin-top:45px !important; }
.topMgn50 { margin-top:50px !important; }
.topMgn55 { margin-top:55px !important; }

/* Padding */
.btmPad0 { padding-bottom:0 !important; }
.btmPad5 { padding-bottom:5px !important; }
.btmPad10 { padding-bottom:10px !important; }
.btmPad15 { padding-bottom:15px !important; }
.btmPad20 { padding-bottom:20px !important; }
.btmPad25 { padding-bottom:25px !important; }
.btmPad30 { padding-bottom:30px !important; }
.btmPad35 { padding-bottom:35px !important; }

.topPad0 { padding-top:0 !important; }
.topPad5 { padding-top:5px !important; }
.topPad10 { padding-top:10px !important; }
.topPad15 { padding-top:15px !important; }
.topPad20 { padding-top:20px !important; }
.topPad25 { padding-top:25px !important; }
.topPad30 { padding-top:30px !important; }
.topPad35 { padding-top:35px !important; }


/*clear fix*/
.wrapper:before, section:before, ul:before, .inBox:before, dl:before, .flBox:before, .clearfix:before { content:""; display: table; }
.wrapper:after, section:after, ul:after, .inBox:after, dl:after, .flBox:after, .clearfix:after { content:""; display: table; clear:both; }
.wrapper, section, ul, .inBox, dl, .flBox, .clearfix { *zoom:1; }

/*float*/
.flL { float:left; margin:0 20px 0 0; }
.flR { float: right; margin:0 0 0 20px; }



/* ============================================
	layout
============================================ */
body { -webkit-font-smoothing: antialiased; /*background:url(../images/ureichan3.png) 90% 12% no-repeat; background-attachment:fixed;*/ }

/*------------------------------------------------------------
	header
------------------------------------------------------------ */
/*reset*/
.navbar, .navbar-default, .navbar-header, .collapse, .navbar-collapse, .nav, .navbar-nav { margin:0; padding:0; background:none; border:0; }
/*base*/
header { position:relative; width:960px; margin:0 auto; }
header h1 { margin:0; padding:0; }
header h1 img { width:200px; }
header .container-fluid { padding:3.5em 0 4em; margin-bottom:5em; border-bottom:1px solid #9774aa; }
.navbar { min-height:inherit; }
.navbar a { transition: all .2s ease-in-out; }
.navbar > .container-fluid .navbar-brand { padding:0; margin:0; }
.navbar-inverse .navbar-nav > li > a { font-size:2.2rem; color:#343370; padding:1.5em .3em 0 1.5em;}
.navbar-inverse .navbar-nav > li > a:hover { color:#9774aa; }
 /*dropdown*/
 .dropdown-menu { position:relative; padding:0; border:0; background:none;}
 .dropdown-menu li { border-top:1px solid #999; }
 
 @media(max-width:767px) {
header { width:100%; }
header h1 { width:50%; }
header h1 img { width:100%; }
header .container-fluid { padding:4% 3%; margin:0 0 2em; }
.container-fluid > .navbar-header { margin:0; }
.container-fluid > .navbar-header, .container > .navb { margin-left:0; }
.navbar-toggle { background-color:#343370; margin:0; }
.navbar-inverse .navbar-toggle:hover, .navbar-inverse .navbar-toggle:focus { background-color:#9774aa; }
.navbar-toggle span { color:#fff; }
.navbar-brand { height:auto; }
.navbar-collapse { padding:0; border:0; }
.navbar-nav { margin:0; }
.navbar-inverse { text-align:center; }
.navbar-inverse li { width: auto; display:inline-block; padding:1em 1.5em 0; }
.navbar-inverse .navbar-nav > li > a { background:none !important; margin:0; padding:1em 0; text-align:center; }
.navbar-inverse .navbar-nav > li > a:hover {  }
.dropdown-menu { position:relative; min-width:106px !important; padding:0; border:0; transition: all .3s ease-in-out;}
.dropdown-menu li { border-top:1px solid #999; opacity:.7; }
.navbar-nav .open .dropdown-menu > li > a, .navbar-nav .open .dropdown-menu .dropdown-header { padding:1em 0; }
 }



/*------------------------------------------------------------
	contents
------------------------------------------------------------ */
section { position:relative; width:100%; margin:0 0 80px; padding:0; }
.inBox { position:relative; width:960px; margin:0 auto 30px; padding:0; }
.flBox { float:left; width:50%; }
.cover { position:relative; width:100%; height: auto; max-height:260px; overflow:hidden; }
.cover img { width:100%; }
.inBox.bdr { margin-bottom:1.6em; padding-bottom:1.4em; border-bottom:1px solid #ccc; }

/* col2 */
.col2 { position:relative; width:47%; margin:0; padding:0; float:left; }
.col2 li:nth-child(odd) { margin-right:3%; }
.col2 li:nth-child(even) { margin-left:3%; }
.col2 li img { width:100%; margin-bottom:1.5em; }
.col2 li p { text-align:center; }
.btmMgn-col2 { margin-bottom:4%; }
/*col3*/
.col3 li { position: relative; width:320px; float:left; padding:0; margin:0; }
.col3 li:nth-child(3n+1) { margin:0 32px 32px 0; }
.col3 li:nth-child(3n) { margin:0 0 32px 32px; }
.col3 li img, .col3 li iframe { width:100%; }
/*col3 border*/
.col3 li.box { width:316px; border:2px solid #ccc; padding-bottom:17px; }
.col3 li.box p { text-align:center; margin-bottom:14px; }
.col3 li.box img { display:block; margin:0 auto; width:280px; }



/*------------------------------------------------------------
	main
------------------------------------------------------------ */
.main{
  background: linear-gradient(45deg, rgba(114,65,128,.6), rgba(137,145,184,.6), rgba(155,122,170,.6));
  background-size:400% 200%;
  animation: AnimationName 7s ease infinite;
  display:flex; justify-content:center; align-items: center;
  width:100vw; height:100vh;
}
.main h1 { font-size:25px; text-align:center; color:#322e6a; letter-spacing:5px; font-family:游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif; }
.main img { display:block; margin:40px auto 0; width:190px; }
.main p { color:#fff; font-weight:bold; text-align:center; letter-spacing:1.5px; line-height:1.2; position:absolute; bottom:2%; left:48%; opacity:.6; }
.main p i { display:block; } 
@keyframes AnimationName {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}

.mainCv { animation: bgAnime 4s infinite linear; margin-bottom:10%; }
@keyframes bgAnime {
  0% { background-color: #8991b8; }
  25% { background-color: #d1bedc; }
  50% { background-color: #9b7aaa; }
  75% { background-color: #724180; }
  100% { background-color: #8991b8; }
}
@media(max-width:767px) {
.main h1 { font-size:2.2rem; letter-spacing:4px; line-height:1.6; }
.main img { margin:40px auto 0; width:40%; }
.main p { left:44%; font-size:1.2rem; }
}
@media(max-width:320px) {
.main h1 { font-size:2rem; }
.main img { margin:30px auto 0; }
.main p { left:42%; }
}


/*------------------------------------------------------------
	about
------------------------------------------------------------ */
main { position:relative; width:100vw; height:100vh; background: rgba(151,116,170,.25);}
main h3 {text-align:center; position:relative; top:40%; color:#9774aa; width:120px; padding-top:170px; margin:0 auto; background: url(../images/ureichan.png) 50% 0 no-repeat; }
.inBox.pl { padding-left:1em;}
h2.catch { font-size:24px; margin-bottom:1.5em; }
/*.inBox.urc { background:url(../images/ureichan2.png) 100% 100% no-repeat; }*/

@media(max-width:767px) {
h2.catch { font-size:2rem; margin-bottom:.8em; }

}
@media(max-width:320px) {
}


/*------------------------------------------------------------
	works
------------------------------------------------------------ */
.works li { width:33.33333333%; box-sizing:border-box; padding:0 1em; margin-bottom:4%; float:left;}
.works li img { width:100%; height:auto; margin-bottom:1em; display:block; }
.works.pf li { padding:0; min-height:197px; max-height:320px; margin:0; overflow:hidden; border:1px solid #fff; }
.works.pf li img { margin:0; }

@media(max-width:767px) {
}


/*------------------------------------------------------------
	table
------------------------------------------------------------ */
table { position:relative; width:100%; color:#343370; }
table.def th, table.def td { border:1px solid #ccc; padding:1.4em 1.2em; font-size:14px; line-height:1.5; text-align:center; }
table.def th { font-weight:bold; background:#f3f5f6; }
table.def td { text-align:left; }
p.gy { margin:2em auto 0; padding:1.5em 2em; border:4px solid #ebedee; width:30%;}
@media(max-width:767px) {
table { position:relative; width:100%; }
table.def th, table.def td { border:1px solid #ccc; padding:1.4em 1.2em; font-size:14px; line-height:1.5; text-align:center; }
table.def th { font-weight:bold; background:#f3f5f6; }
table.def td { text-align:left; }
}


/*------------------------------------------------------------
	form
------------------------------------------------------------ */
form table { margin-bottom:1.5em; width:auto; }
form table th, form table td { font-size:14px; border-bottom:1px solid #9774aa; padding:1em .5em; text-align:left; }
form table th { font-weight:bold; }
form table th span { color:#e52c65; margin-right:5px; }
form table td { width: 500px; word-break: break-word; }
input[type="text"], input[type="email"], textarea { border:1px solid #ccc; padding:.1em .6em;}
 input[type="button"], input[type="submit"], input[type="reset"] { -webkit-appearance: none; background:none; border:1px solid #9774aa; margin:0 .5em; padding:.5em 1em; color:#343370; }

@media(max-width:767px) {
form table { width:100% !important; padding:0 !important; background-color:#fff; border-collapse: collapse; border-spacing: 0; }
form table th, form table td, table tr { display: block; width:100% !important; margin:0 auto !important; text-align:left !important; }
form table th, form table td { font-size:1.4rem; }
form table th { text-align: center; border:0; padding-bottom:0; }

input[type="text"], input[type="email"], textarea { width:100% !important; font-size:110% !important; height:100% !important; padding:0.5em !important; }

.btn-form { width:150px; margin: 20px 15px 0; border:0; padding:10px 0; font-size: 16px; color: #d14c2d !important; background:#e3e3e3; transition: all .3s ease-in-out; }
.btn-form:hover,
.btn-form:focus,
.btn-form:active,
.btn-form.active { color: #fff !important; background: #d14c2d; }
.error_messe { color:#d14c2d; }
.sbm_btn { border:0; background:none; padding:0; margin:0; cursor:pointer; }
p.inqBtn { text-align:center; margin-bottom:1.5em; }

/* 問い合わせボタン */
p.inqBtn button { 
	font-size:1.6rem;
	position: relative;
	display: inline-block;
	width: 200px;
	height: 50px;
	background-color: #f56778;
	background-image: -webkit-linear-gradient(top, #f997b0, #f56778);
	background-image: linear-gradient(to bottom, #f997b0, #f56778);
	border-radius: 10px;
	color: #fff;
	text-align: center;
	text-decoration: none;
	outline: none;
	font-weight:bold;
 }
 
 
 input[type="button"], input[type="submit"], input[type="reset"] { width:40%; padding:1em; }
 

/*------------------------------------------------------------
	チェックボックスのスタイル
------------------------------------------------------------ */
input[type="checkbox"] {
    -webkit-appearance: none;
    position: relative;
    margin-right: 5px;
    border-radius: 8px;
    border: 1px solid #4c4c4c;
    -webkit-box-sizing: border-box;
    width: 28px;
    height: 28px;
    background: -webkit-gradient(
        linear,
        left top,
        left bottom,
        from(#fdfdfd),
        to(#d1d1d1)
    );
    vertical-align: middle;
}
/* チェック時は背景色を変更 */
input[type="checkbox"]:checked {
    background: -webkit-gradient(
        linear,
        left top,
        left bottom,
        from(#353535),
        to(#8f8f8f)
    );
}
/* チェックの印を:before疑似要素と:after疑似要素を使って作成 */
input[type="checkbox"]:checked:before {
    position: absolute;
    left: 1px;
    top: 17px;
    display: block;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 1);
    content: "";
    width: 10px;
    height: 4px;
    background: #FFFFFF;
    -webkit-transform: rotate(45deg);
    -webkit-transform-origin: right center;
}
input[type="checkbox"]:checked:after {
    display: block;
    position: absolute;
    left: 9px;
    top: 17px;
    content: "";
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 1);
    width: 19px;
    height: 4px;
    background: #FFFFFF;
    -webkit-transform: rotate(-53deg);
    -webkit-transform-origin: left center;
}

/*------------------------------------------------------------
	ラジオボタンのスタイル
------------------------------------------------------------ */
input[type="radio"] {
    -webkit-appearance: none;
    position: relative;
    margin-right: 5px;
    border-radius: 14px;
    border: 1px solid #4c4c4c;
    -webkit-box-sizing: border-box;
    width: 28px;
    height: 28px;
    background: -webkit-gradient(
        linear,
        left top,
        left bottom,
        from(#fdfdfd),
        to(#d1d1d1)
    );
    vertical-align: middle;
}
/* チェック時は背景色を変更 */
input[type="radio"]:checked {
    background: -webkit-gradient(
        linear,
        left top,
        left bottom,
        from(#353535),
        to(#8f8f8f)
    );
}
/* チェックの印を:before疑似要素を使って作成 */
input[type="radio"]:checked:before {
    position: absolute;
    left: 50%;
    top: 50%;
    display: block;
    margin: -5px 0 0 -5px;
    -webkit-box-shadow: 0 2px 1px rgba(0, 0, 0, 1);
    content: "";
    border-radius: 5px;
    width: 10px;
    height: 10px;
    background: -webkit-gradient(
        linear,
        left top,
        left bottom,
        from(#fdfdfd),
        to(#d1d1d1)
    );
}
}

/*------------------------------------------------------------
	footer
------------------------------------------------------------ */
footer { position:relative; width:100%; margin:0; padding:0 0 1.5em; }
footer section { margin:0; padding:30px 0; }
footer .inBox { margin-bottom:0; text-align:center; }
footer li { width:300px; display:block; margin:0 62px 0 0; float:left; }
footer li:last-child { margin:0; }
footer p { text-align:center; margin:0; font-size:12px; letter-spacing:1px; }
a.pagetop { position:fixed; right:3%; bottom:5%; background:rgba(52,51,112,.85); color:#fff; padding:1em 1.3em; border-radius:50%; display:block; z-index:9999;}
a.pagetop:hover { background:rgba(52,51,112,1); }
a.pagetop i { padding:0; font-size:150%; }
@media(max-width:767px) {
footer section { padding:1.5em 0 0; }
footer li { width:60%; display:block; margin:0 auto 10px; float:none; }
footer li:last-child { margin:0 auto; }
footer li img { width:100%; display:block; }
footer .logo { width:60%; margin:1.5em auto; }
footer p {  font-size:1.1rem; }
a.pagetop {right:5%; bottom:7%; padding:.6em 1.1em .7em; }
a.pagetop i { font-size:110%; }
}


/*------------------------------------------------------------
	other
------------------------------------------------------------ */
/* Sharing Facilitator */
a.addthis_button { display:none; }
body.single a.addthis_button { display:inline; }
@media(min-width:767px) {
	.onlySp { display:none !important; }
}
@media(max-width:767px) {
	.onlySp { display:block !important; }
}